jquery - jQuery禁用和启用滚动

Question

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

窗口滚动被禁用，每次我离开元素。如何使用 mouseleave 事件启用滚动？

Answer 1

我编写了一个 jQuery 插件来处理这个问题：$.disablescroll。

它停止从鼠标滚轮、touchmove 和按钮（例如Page Down.

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

    $(window).disablescroll();

}).mouseleave(function() {

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

});

希望有人觉得这很有帮助。

Answer 2

像这样？

$('#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());
    }
});​

Answer 3

我目前在引导游览中使用插件，目标是在单击链接时禁用滚动，并在您单击游览中的“结束游览”按钮时启用它。

在 HTML 中，div通过以下方式创建链接id：

<div id='placeholder'><a href='#'>Placeholder link</a> </div>

使用 click 函数实例化 jquery。

启动jquery：

$(document).ready(function() {
    /*click Function*/
    $('#placeholder').click(function(){
        /*Disables scrolling*/
        $('body').css('scroll', function(){
            window.scrollTo(0,0);
        });
    });  
});

结束弹出窗口时的插件选项引导程序：

/*This fire when clicking End Tour & placeholder would only work if that what you named the tour.*/
onEnd: function(placeholder) {
    /*Enable scroling*/
    $('body').css({ 'overflow': 'scroll' });
    $(document).off('scroll');
}