1. 禁止双击缩放

1 <meta name="viewport" 2 content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>

　　此时，完全禁止缩放了，例如，想放大查看某张图片也是不被允许的

　　适用场景： 无需用户放大查看的元素页面、游戏页面等（注：ios10以前，上面是有效的）

 

2. width=device-width

1 <meta name="viewport" content="width=device-width">

　　它只是去除了双击缩放，缩放功能并非被完全禁用，但用户仍可以使用双指缩放。

一般都是联合着一起写：

1 <meta
2       name="viewport"
3       content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
4 />

　　从IOS10开始，苹果开始允许用户强制双击缩放（其实，并不是都可以缩放，好像只是针对图片，会有一个双击放大再次复原的效果） => 那么，可以用上面这条meta语句应付了，至于还想禁止双指缩放，则需要js了。

 

3. 指针事件 (Pointer Events)

　　触摸动作也经常用于完全解决由支持双击缩放手势引起的点击事件的延迟。

1 html {
2   touch-action: manipulation; // 值为none时，禁用元素（及其不可滚动的后代）上的所有手势
3 }

　　manipulation只允许进行滚动和持续缩放操作。启用平移和缩小缩放手势，但禁用其他非标准手势，例如双击以进行。

 

 

 

4. FastClick

　　FastClick 是 FT Labs 专门为解决移动端浏览器 300 毫秒点击延迟问题所开发的一个轻量级的库。

　　FastClick 使用方法: 在 window load 事件之后，在 <body> 上调用 FastClick.attach() 。

1 window.addEventListener( "load", function() {
2     FastClick.attach( document.body );
3 }, false );