鼠标滚轮插件在Firefox中不起作用答案

【问题标题】：mousewheel plugin not working in firefox鼠标滚轮插件在Firefox中不起作用
【发布时间】：2012-09-18 00:08:33
【问题描述】：

我一直在使用 Brandon aarons 鼠标滚轮插件，并且正在使用 webkit 浏览器，但是它在 firefox 上不起作用。

这是 Brandon aaron 的原始代码，在 webkit 上很棒

$('body').on('mousewheel', function(event, delta){
  this.scrollLeft -= (delta*30);
  event.preventDefault();
});

所以我切换到http://cobbweb.me/blog/2012/03/30/jquery-mousewheel-plugin-version-2/ 应该可以在firefox上运行，尝试了这个代码

$('body').on('mousewheel', function(event, delta, deltaX, deltaY){

  event.preventDefault();
});

我尝试将 scrollLeft 放在那里，并用 deltaY 替换并 DOMMouseScroll 或 MozMousePixelScroll 但仍然无济于事。如何使这项工作在鼠标滚轮上绑定，以便我的页面在 Firefox 上水平滚动？

谢谢！

【问题讨论】：

【解决方案1】：

你应该看看scrollLeft on body not working in firefox

他们通过将 $('body')... 更改为 $('html, body')... 来修复它

【讨论】：

【解决方案2】：

您可以通过自己处理 DOM 事件来解决此问题（使用和没有插件）。

像这样：

$('body').on('mousewheel DOMMouseScroll MozMousePixelScroll', function(event, delta, deltaX, deltaY){
    event.preventDefault();
});

您可以在here 中看到它（在 Chrome 和 Firefox 中测试）。

但是，scrollLeft 和 scrollTop 在 Firefox 中似乎不起作用（在 jQuery 或基本 JavaScript 中）。请参阅this fiddle（应输出“5”；在 Chrome 上输出，但在 Firefox 上输出“0”）。

【讨论】：

是的，它适用于插件。记录正确的值。我认为问题出在scrollLeft ...当我在Firefox中传递任何增量值时，它根本不起作用。它记录正确的任何增量值。所以问题是，我如何将它绑定为水平滚动（scrollLeft）并在 firefox 上工作？
firefox 似乎也没有计算 delta*number ......嗯，为什么？它只是返回 NaN。 webkit 做的很好
实际上，您面临的问题似乎与 scrollLeft 和 scrollTop 在 Firefox 中不起作用有关。 This fiddle 在 Firefox 中吐出“0”，在 Chrome 中吐出“5”。如果它还没有在他们的队列中，这对 Mozilla 来说将是一个错误。
对于delta*number，输出两者的值。如果它们都是数字（我对此表示怀疑），那么其中一个可能是字符串。
Firefox 可能收到了一些拙劣的delta 值？这看起来很像某种 Firefox 错误。

【解决方案3】：

尝试：(1) event 'mousewheel'，(2) function(event)，以及(3) 使用 event.deltaFactor * event.deltaX 来检测滚动距离。

检查https://github.com/jquery/jquery-mousewheel，非常短的部分“获取滚动距离”。

【讨论】：