javascript – 如何在iOS 11.3 safari中禁用视口缩放？-无忧网

我已经尝试了所有(是的所有!!!)来自这个question的解决方案,似乎没有任何东西可以用于iOS 11.3？

有人成功防止使用ios 11.3进行缩放吗？
PS：我知道有充分的理由不防止捏缩放….但我别无选择.非常感谢,对不起我的英语.

解决方法:

请注意,大多数这些选项会破坏大量功能,并且对可访问性等不利,但某些应用程序,尤其是多点触控PWA需要禁用这些功能.使用风险自负.

关于父评论,他们已经尝试了链接中的所有解决方案,请注意“请注意,如果任何更深层的目标在事件上调用stopPropagation,事件将无法到达文档,并且不会阻止缩放行为通过这个听众.“ – 这是关键.

添加此脚本标记适用于iOS 11.3 Safari(在iPhone SE上测试)

<script>
    document.addEventListener('touchmove',
        function(e) {
            e.preventDefault();
        }, {passive:false});
</script>

当然,您必须处理所有触摸输入(如果您需要定制的多点触控PWA,那么无论如何您都必须这样做).

>有一点需要注意的是,滚动是以这种方式禁用的(也许有一种解决方法？)但是当你需要一个屏幕PWA时,这是一个加号.
>另一个警告是,对于类似PWA的行为,内容本身最多需要

height:100%

这样,Safari中的顶部和底部栏(URL和底部导航)不会切断任何内容(至少在纵向方向上).
>最后一点需要注意的是,双击缩放功能仍可在此模式下运行.禁用它的最佳方法是在根节点上设置以下内容

touch-action:manipulation;

但是,这仅在根节点可单击时才有效,因此向元素添加一个空的onclick处理程序.

最后,因为节点现在是可点击的,它可能具有您可能不想要的按钮的半透明覆盖,可以隐藏

-webkit-tap-highlight-color: rgba(0,0,0,0);

【说明】：本文章由站长整理发布，文章内容不代表本站观点，如文中有侵权行为，请与本站客服联系(QQ:254677821)！

javascript – 如何在iOS 11.3 safari中禁用视口缩放？