解决iOS10下Meta设置user-scalable=no无效问题

Posted 紫诺花开

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了解决iOS10下Meta设置user-scalable=no无效问题相关的知识,希望对你有一定的参考价值。

苹果为了提高Safari中网站的辅助功能,屏蔽了Meta下的user-scalable=no功能

所以在ios10下面,就算加上user-scalable=no,Safari浏览器也能支持手动缩放

解决这个问题的办法可以用Js监听来阻止手动进行缩放

以下是代码

//通过touchstart和touchend
window.onload=function () {  
        document.addEventListener(‘touchstart‘,function (event) {  
            if(event.touches.length>1){  
                event.preventDefault();  //阻止元素的默认行为
            }  
        })  
        var lastTouchEnd=0;  
        document.addEventListener(‘touchend‘,function (event) {  
            var now=(new Date()).getTime();  
            if(now-lastTouchEnd<=300){  
                event.preventDefault();  
            }  
            lastTouchEnd=now;  //当前为最后一次触摸
        },false)  
    }

 

以上是关于解决iOS10下Meta设置user-scalable=no无效问题的主要内容,如果未能解决你的问题,请参考以下文章

完美解决ios10及以上Safari无法禁止缩放的问题

通过阻止 touchstart 事件,解决移动端的 BUG

iOS 10.3下解决Fiddler代理抓包ssl证书信任问题

ios10中禁止用户缩放页面

iOS 10.3下解决Charles抓包ssl证书信任问题

解决ios10及以上Safari双击和双指缩放无法禁止的问题