1

https://jsfiddle.net/swek0epj/

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

I tested above code by pushing mouse scroll to the right in various browsers and results are:

Chrome version 48: 25

Firefox version 44: 0.75

Internet Explorer version 11: 14.24

Microsoft Edge version 13: -21.36

Problem is, I need to detect the direction to navigate with side scroll and direction is reversed on Edge (it is negative)

Any proposal to make this cross browser without using outdated MouseWheelEvent (without wheelDeltaX) or MouseScrollEvent?

daghan
  • 948
  • 10
  • 18

1 Answers1

0

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

A patch which detects Microsoft Edge browser and reverses the sign:

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
    ...
  }
})

Please note that this is not a robust solution. i.e. if Microsoft Edge fixes the bug, you have to delete the first if block for sign reversion.

Browser detection is from: Detecting Microsoft's edge or spartan with javascript

Community
  • 1
  • 1
daghan
  • 948
  • 10
  • 18