前段时间在公司做了个简单的列表切换效果,在安卓设备上面效果好好的,到了苹果设备上列表切换有严重的卡顿的感觉。原来移动端有click事件延迟300ms这个大坑。
造成这个坑的原因就是移动端浏览器通常还要响应双击事件,等300ms就是要判断你是否要进行双击操作好去缩放页面的大小,而我的页面已经禁止了缩放(webapp通用套路),安卓设备的浏览器禁止了缩放自然就不响应双击事件了,300ms延迟自然也就没有了。坑爹的苹果设备页面就算不能缩放还是得延迟300ms,不知道是设计缺陷还是啥原因。
解决方案网上说了很多,我下载了个fastclick.js成功解决
这里下载:http://codestorm.cn/webftp/data/nfs/B/Code/fastclick.min.js
用法
$(function() { FastClick.attach(document.body); });