我已经将我的iPhone 6 plus更新到iOS 10测试版,刚刚发现在移动Safari中,你可以通过双击或捏住IGNORE元标签中的user-scalable=no
代码来放大任何网页。我不知道这是否是一个错误或功能。如果它被认为是一个功能,我们如何禁用视口缩放的iOS 10 safari?
更新了iOS 11/12版本,iOS 11和iOS 12 safari仍然不***尊重user-scalable=no
元标签。
在iOS 10上防止safari中的网页缩放是可能的,但这将涉及到你更多的工作。我猜想,一定程度的困难应该能阻止货真价实的开发者将"user-scalable=no"放入每个视口标签中,使视力受损的用户感到不必要的困难。
不过,我还是希望看到苹果公司改变他们的实现方式,以便有一个简单的(元标签)方法来禁用双击变焦。大部分的困难都与这种互动有关。
你可以用这样的方法来停止捏合变焦。
document.addEventListener('touchmove', function (event) {
if (event.scale !== 1) { event.preventDefault(); }
}, false);
注意,如果有更深层次的目标对该事件调用stopPropagation,该事件将不会到达文档,缩放行为也不会被这个监听器阻止。
禁用双击缩放也是类似的。你禁用任何发生在前一次点击后300毫秒内的对文档的点击。
var lastTouchEnd = 0;
document.addEventListener('touchend', function (event) {
var now = (new Date()).getTime();
if (now - lastTouchEnd <= 300) {
event.preventDefault();
}
lastTouchEnd = now;
}, false);
如果你没有正确设置你的表单元素,关注一个输入会自动变焦,由于你已经基本禁用了手动变焦,现在几乎不可能取消变焦。请确保输入的字体大小为>=16px。
如果你想在本地应用程序的WKWebView中解决这个问题,上面给出的解决方案是可行的,但这是一个更好的解决方案:https://stackoverflow.com/a/31943976/661418。而正如其他答案中提到的,在iOS 10 beta 6中,苹果现在提供了一个标志来兑现元标签。
2017年5月更新:我用更简单的'check event.scale on touchmove'方法替换了旧的'check touches length on touchstart'禁用捏合缩放的方法。对大家来说应该更可靠。
看起来这种行为据说在最新的测试版中有所改变,在写这篇文章时是测试版6。
来自iOS 10 Beta 6的发布说明。
WKWebView
现在默认为尊重视口的user-scalable=no
。WKWebView
的客户端可以提高可访问性,允许用户 通过设置WKWebViewConfiguration
,在所有页面上进行捏合缩放。 属性ignoresViewportScaleLimits
为YES
。
然而,在我的(非常有限的)测试中,我还不能确认这是事实。
编辑:经过验证,iOS 10 Beta 6默认尊重user-scalable=no
,对我来说。