Firefox 中的 Highcharts 鼠标滚轮滚动事件

Question

我有一个带有鼠标滚轮滚动事件的 Highcharts 组件。

在除 firefox 之外的所有浏览器中一切正常。在 firefox 中，mousewheel 事件会触发 Highcharts 组件和整个 window 中的滚动。我尝试添加 event.preventDefault() 和 event.stopPropagation() 但这并没有解决问题。有什么方法可以防止滚动 Highcharts 组件时整个 window 滚动吗？

Answer 1

出现您的问题是因为 DOMMouseScroll 和 mousewheel 事件现在 已弃用 ，并被新的 wheel 事件取代，该事件在所有浏览器。您需要替换代码中的两个内容才能使其正常工作。

首先，请在这里更改活动名称：

H.addEvent(chart.container, 'wheel', function(event) {

然后在您的 wheel 事件函数主体中将增量赋值替换为：

delta = e.detail || -(e.deltaY / 120);
delta = delta < 0 ? 1 : -1;

现在它在所有浏览器上都以相同的方式工作。

实例： http://jsfiddle.net/d3r8pb7c/

API参考：

https://developer.mozilla.org/en-US/docs/Web/Events/wheel

https://developer.mozilla.org/en-US/docs/Web/Events/mousewheel

https://developer.mozilla.org/en-US/docs/Web/Events/DOMMouseScroll

Firefox 中的 Highcharts 鼠标滚轮滚动事件

Highcharts mousewheel scroll event in firefox

javascript

firefox

mousewheel

highcharts