Browse By

Prevent browser zoom feature from both keyboard and mouse+ctrl using jQuery / JavaScript

Obviously this is not a good idea to prevent user from those default functionalities provided by browser. But in some cases we had no choice rather than prevent browser zoom feature from both keyboard and mouse. This can be achieved by the help of JavaScript.

You can try out with any one the JavaScript code snippet provided below:

jQuery CodeĀ Snippet – 1

//Prevent zoom while using ctrl and mouse wheel
$(window).bind('mousewheel DOMMouseScroll', function(e)
{
    //ctrl key is pressed
    if(e.ctrlKey == true)
    {
        e.preventDefault();

        //Your logic here
        console.log("Zoom Feature Disabled. ctrl+Mousewheel Pressed");        
    }
});

jQuery CodeĀ Snippet – 2

$(window).keydown(function(event)
{
    if((event.keyCode == 107 && event.ctrlKey == true) || (event.keyCode == 109 && event.ctrlKey == true))
    {
        event.preventDefault();
        //Your logic here
        console.log("Zoom Feature Disabled. ctrl+Mousewheel Pressed");
}
}

NOTE: Some cases replacing document with windows works well.

Latest Posts