使用 Javascript/Jquery 在桌面 Web 浏览器中禁用页面缩放
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14050841/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disable zooming of the page in desktop web browsers using Javascript/Jquery
提问by user782104
Possible Duplicate:
How to detect page zoom level in all modern browsers?
可能的重复:
如何在所有现代浏览器中检测页面缩放级别?
var obj=document.body; // obj=element for example body
// bind mousewheel event on the mouseWheel function
if(obj.addEventListener)
{
obj.addEventListener('DOMMouseScroll',mouseWheel,false);
obj.addEventListener("mousewheel",mouseWheel,false);
}
else obj.onmousewheel=mouseWheel;
function mouseWheel(e)
{
// disabling
e=e?e:window.event;
if(e.ctrlKey)
{
if(e.preventDefault) e.preventDefault();
else e.returnValue=false;
return false;
}
}
I am developing a web app and all ui element will be not in a correct order if user zoom in / zoom out . So, are there any way to prevent it? I have think of some way to do it but is it possible ?
我正在开发一个 Web 应用程序,如果用户放大/缩小,所有 ui 元素的顺序都将不正确。那么,有没有什么办法可以预防呢?我已经想到了一些方法来做到这一点,但有可能吗?
1) Get the screen resolution of the user. When the window size is change (either width or height), return the window width/height to screen width /height.
1) 获取用户的屏幕分辨率。当窗口大小发生变化(宽度或高度)时,将窗口宽度/高度返回到屏幕宽度/高度。
2) bind the mouse scroll event or keyboard event to nothing. (Refer to above demo code) , but what if the user click on the browser and select zoom in ?
2) 将鼠标滚动事件或键盘事件绑定到空。(参考上面的演示代码),但是如果用户点击浏览器并选择放大呢?
Thanks
谢谢
回答by ?brahim Alt?noluk
var zoomlevel=1;
$("body").dblclick(function(ev) {
zoomlevel = zoomlevel == 1 ? 2 : 1;
$(this).css({
"-moz-transform":"scale("+zoomlevel+")",
"-webkit-transform":"scale("+zoomlevel+")",
"-o-transform":"scale("+zoomlevel+")",
"-ms-transform":"scale("+zoomlevel+")"
});
});

