移动端 按钮按下时 颜色改变

html:

<button class="friend">确定</button>

css:

*{
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
}
button{
    width: 80%;
    height: 50px;
    background: #f66;
    border: 0;
    color: #fff;
    border-radius: 5px;
    font-size: 20px;
}

js:

$(".friend").on("touchstart", function() {
      $(this).css({opacity:0.8});
}).on("touchend", function() {
      $(this).css({opacity: 1});
});
$(".friend").on("click",function(){
      alert(0)
 })

效果：
按钮正常

按钮按下时
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容