防止页面缩放

JavaScript - prevent page zooming

本文关键字:缩放      更新时间:2023-09-26

我有一个将在平板电脑(在Internet Explorer)上使用的web应用程序。编辑:不是平板电脑,而是带触摸屏的Windows 7电脑。

问题是用户可以通过捏键来缩放页面(如ctrl-+)。

是否有办法从JavaScript禁用它?(如在移动设备上)。

或者把用户代理改成像iPad一样?

使用

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

放在文档的<head>部分,以防止在移动设备上缩放网站。这里重要的是user-scalable=no,它使技巧。

编辑

做了更多的研究,你还可以选择添加:

<meta name="MobileOptimized" content="640">

content="640"是您想要设置的width,其行为与<meta name="viewport" content="width=640,user-scalable=no">相似。

您可以通过Ctrl+Ctrl-或使用Ctrl键+鼠标上下滚轮来禁用浏览器缩放

$(document).keydown(function(event) {
if (event.ctrlKey==true && (event.which == '61' || event.which == '107' || event.which == '173' || event.which == '109'  || event.which == '187'  || event.which == '189'  ) ) {
        event.preventDefault();
     }
    // 107 Num Key  +
    // 109 Num Key  -
    // 173 Min Key  hyphen/underscor Hey
    // 61 Plus key  +/= key
});
$(window).bind('mousewheel DOMMouseScroll', function (event) {
       if (event.ctrlKey == true) {
       event.preventDefault();
       }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
teste