admin管理员组

文章数量:1355564

I'm working on a canvas app embedded in a page. I have it so you can zoom into the drawing with the mousewheel but unfortunately this scrolls the page as it is part of an article.

Is it possible to prevent mousewheel scrolling on the window when I'm mousewheeling on a dom element?!

I'm working on a canvas app embedded in a page. I have it so you can zoom into the drawing with the mousewheel but unfortunately this scrolls the page as it is part of an article.

Is it possible to prevent mousewheel scrolling on the window when I'm mousewheeling on a dom element?!

Share Improve this question asked Dec 5, 2008 at 9:13 JonJon
Add a ment  | 

2 Answers 2

Reset to default 9

Attach an event handler for mousewheel (Not Gecko) / DOMMouseScroll (Not IE) and prevent its default action (that is to scroll content):

if (element.addEventListener)
    element.addEventListener("DOMMouseScroll", function(event) {
        event.preventDefault();
    }, false);
else
    element.attachEvent("mousewheel", function() {
        return false;
    })

Hope this helps!

I know this is old, but this may still be helpful to googlers.

I've written a jQuery plugin to handle this: $.disablescroll.

Not only does it handle mousewheels, but also touchmove and keypress events which would normally trigger a scroll.

// disable all scrolling:
$(window).disablescroll();

// enable scrolling again:
$(window).disablescroll("undo");

本文标签: javascriptHow do I suppress window mouse wheel scrollingStack Overflow