jQuery Mousewheel 插件乘以增量因子答案

【问题标题】：jQuery Mousewheel Plugin Multiplying Delta FactorjQuery Mousewheel 插件乘以增量因子
【发布时间】：2014-11-10 09:09:34
【问题描述】：

我正在使用 jQuery Mousewheel 插件并遇到了一个我无法单独解决的问题。

我编写了一个函数，通过窗口宽度检查两种屏幕尺寸。第一个检查窗口宽度是否大于 768px，如果是，我希望站点水平滚动。第二个检查窗口宽度是否低于或等于 768px，如果是，我希望网站垂直滚动。

该函数在文档就绪函数和窗口调整大小函数中被调用。它运行良好，直到我开始手动调整浏览器的大小。如果我在不刷新页面的情况下这样做，每次调整窗口大小时鼠标滚轮速度似乎都会成倍增加。

这里有一段代码给大家看看：

function resize() {

    if ( $(window).width() > 768 ) {

        // Scroll horizontally
        $('#scroll').mousewheel(function(event, delta) {
            this.scrollLeft -= (delta * 40);
            event.preventDefault();
        });

    }
    else if ( $(window).width() <= 768 ) {

        // Scroll vertically
        $('#scroll').mousewheel(function(event, delta) {
            this.scrollTop -= (delta * 40);
            event.preventDefault();
        });

    }

}

$(document).ready(function() {

    resize();

});

$(window).resize(function() {

    resize();

 });

知道我该如何解决这个问题吗？还是有更好的方法来做到这一点？提前致谢！

【问题讨论】：

标签： jquery scroll mousewheel multiplication

【解决方案1】：

每次调用$('#scroll').mousewheel(function () { ... }) 时，都会为mousewheel 事件添加一个新的处理程序。您看到的“相乘”效果是多个事件处理程序同时对scrollLeft/scrolltop 进行加/减的结果。

在添加新的处理程序之前，您需要使用.off() 或.unmousewheel() 删除resize() 中任何以前的mousewheel 处理程序。

【讨论】：