jQuery disable and enable scrolling

Question

$('.news-wrap').mouseenter(function(event) {
    $(window).mousewheel(function(event) {
        event.preventDefault();
    });
});

Window scrolling is disabled, each I leave the element. How can I enable scrolling with mouseleave event?

Solution 1

Like this?

$('#abs').bind('mousewheel DOMMouseScroll', function(e) {
    var scrollTo = null;
    if (e.type == 'mousewheel') {
        scrollTo = (e.originalEvent.wheelDelta * -1);
    } else if (e.type == 'DOMMouseScroll') {
        scrollTo = 1000 * e.originalEvent.detail;
    }

    if (scrollTo) {
        e.preventDefault();
        $(this).scrollTop(scrollTo + $(this).scrollTop());
    }
});​

Solution 2

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

It stops scrolling from mousewheel, touchmove, and buttons such as Page Down.

$('.news-wrap').mouseenter(function() {

    $(window).disablescroll();

}).mouseleave(function() {

    $(window).disablescroll("undo");

});

Hope someone finds this helpful.