4

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 ?

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.

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 ?

Thanks

Community
  • 1
  • 1
user782104
  • 13,233
  • 55
  • 172
  • 312
  • 3
    This question has been answered in a related question here: http://stackoverflow.com/questions/1713771/how-to-detect-page-zoom-level-in-all-modern-browsers – Blake Regalia Dec 27 '12 at 07:28
  • But is it possible to using the first approach? – user782104 Dec 27 '12 at 07:48
  • Even if you interrupt all key combinations that would let the user zoom, there still would be "zoom" buttons in the browser UI. Those can't be disabled. – Cerbrus Dec 27 '12 at 08:02
  • 3
    A bit disappointed why moderators who mark a duplicate where the duplicate reference is so poorly asked, titled, and answered, don't also improve the reference, to make it a good solution to both "duplicates". Could have at least fixed the referenced duplicate's title to match its content. – matanster May 01 '14 at 10:35

1 Answers1

9
    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+")"
        });


    });