禁用视口缩放iOS 10+ safari？

Question

禁用视口缩放iOS 10+ safari？

我已经更新我的iPhone 6加至10的iOS beta版本，只是发现，在移动Safari浏览器，您可以通过双击放大任何网页或捏忽略了user-scalable=no在meta标签代码。我不知道这是一个错误或功能。如果它被视为一项功能，我们如何禁用视口缩放iOS 10 Safari？

---

在iOS 11/12发布，iOS 11和iOS 12 safari上更新仍然不尊重user-scalable=no元标记。

Answer 1

在iOS 10上可以防止在Safari中进行网页扩展，但这将涉及到您的更多工作。我猜这个论点是，一定程度的困难应该阻止货币狂热的开发者将“用户可扩展=否”放入每个视口标签中，并使视力受损的用户感到不必要的困难。尽管如此，我还是希望Apple改变它们的实现方式，以便有一种简单的（元标记）方式来禁用双击缩放。大多数困难与这种互动有关。你可以用这样的东西停止捏缩放：document.addEventListener('touchmove',&nbsp;function&nbsp;(event)&nbsp;{ &nbsp;&nbsp;if&nbsp;(event.scale&nbsp;!==&nbsp;1)&nbsp;{&nbsp;event.preventDefault();&nbsp;}},&nbsp;false);请注意，如果任何更深层的目标在事件上调用stopPropagation，则事件将不会到达文档，并且此侦听器将不会阻止缩放行为。禁用双击缩放类似。您可以在之前的点击300毫秒内禁用对文档的任何点击：var&nbsp;lastTouchEnd&nbsp;=&nbsp;0;document.addEventListener('touchend',&nbsp;function&nbsp;(event)&nbsp;{ &nbsp;&nbsp;var&nbsp;now&nbsp;=&nbsp;(new&nbsp;Date()).getTime(); &nbsp;&nbsp;if&nbsp;(now&nbsp;-&nbsp;lastTouchEnd&nbsp;<=&nbsp;300)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;event.preventDefault(); &nbsp;&nbsp;} &nbsp;&nbsp;lastTouchEnd&nbsp;=&nbsp;now;},&nbsp;false);如果您没有正确设置表单元素，则关注输入将自动缩放，并且由于您大部分已禁用手动缩放，现在几乎不可能取消缩放。确保输入字体大小> = 16px。如果您尝试在本机应用程序中的WKWebView中解决此问题，上面给出的解决方案是可行的，但这是一个更好的解决方案：正如其他答案中所提到的，在iOS 10 beta 6中，Apple现在提供了一个标志来表示元标记。我用更简单的'touch event.scale on touchmove'方法取代了旧的'touch touch on touchstart'方法，禁用了双指缩放。应该对每个人都更可靠。

Answer 2

这是iOS 10中的新功能。从iOS 10 beta 1发行说明：为了提高Safari网站的可访问性，即使网站设置user-scalable=no在视口中，用户现在也可以进行缩放。我希望我们很快就会看到JS插件以某种方式禁用它。

Answer 3

我已经能够使用touch-action单个元素上的css属性来解决这个问题。尝试设置touch-action: manipulation;常用的元素，如链接或按钮。