Question

https://jsfiddle.net/swek0epj/

document.addEventListener('wheel', function(e) {
  alert(e.deltaX);
})

我通过在各种浏览器中向右推动鼠标滚动来测试上面的代码，结果是：

Chrome版本48： 25

Firefox版本44： 0.75

Internet Explorer版本11： 14.24

Microsoft Edge版本13： -21.36

问题是，我需要通过侧滚动来检测导航方向，并且在Edge上反转方向（它是负数）

在不使用过时的MouseWheelEvent（没有wheelDeltaX）或MouseScrollEvent的情况下制作此跨浏览器的任何建议？

Answer 1

https://jsfiddle.net/swek0epj/3/

检测Microsoft Edge浏览器并反转符号的补丁：

document.addEventListener('wheel', function(e) {
  deltaX = e.deltaX;
  // Revert the sign if Microsoft Edge. When they fix it, remove:
  if (navigator.userAgent.match(/Edge\/\d+/)) {
    deltaX = -deltaX;
  }
  if (deltaX > 0) {
    // right horizontal scroll
    ...
  }
  if (deltaX < 0) {
    // left horizontal scroll
    ...
  }
})

请注意，这不是一个强大的解决方案。即如果Microsoft Edge修复了该错误，则必须删除第一个if块以进行符号恢复。

浏览器检测来自： Detecting Microsoft's edge or spartan with javascript

水平鼠标滚动deltaX在Microsoft Edge上反转，如何检测？

1 个答案: