背景:double tap to zoom
当用户点击屏幕以后,浏览器不能直接判断用户是点击操作,仍是双击缩放,因此浏览器的做法是等候300ms来判断用户是进行了什么操作。
响应速度是移动端用户体验的重要因素,超越100ms便认为是卡顿。
解决方案:
一、Fastclick
// FastClick运用十分简略
window.addEventListener('load'.function(){
FastClick.attach(document.body);
},false);
fastclick原理
- 监听touchend事情(touchstart touchend会优先于click触发)
- 运用自定义DOM事情模仿一个click事情
- 把默认的click事情(300ms之后触发的)制止掉
二、width = device-width
现代浏览器做了一些改进
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0" >
<title>title</title>
</head>
三、制止缩放
<head>
<meta name="viewport" content="user-scalable=no,initial-scale=1.0" >
<title>title</title>
</head>