What is responsible for the mousewheel trigger?

Question

I would like a slider to change slides by using the mousewheel with jquery. Which command is responsible for when the mousewheel triggers? I would like the slide to change once you slightly use the wheel, not after scrolling for some time.

Answer 1

The onwheel event can be used:

 <element onwheel="myScript"> 

or

document.getElementById("myDIV").addEventListener("wheel", myFunction);

function myFunction(event) {
  console.log(event);
}

You can do this with jquery:

$("#myDIV").on({
  wheel: function(event){
      console.log(event.originalEvent.deltaY);
    }
  });

The event object contains the following data:

deltaX: Returns the horizontal scroll amount of a mouse wheel (x-axis)

deltaY: Returns the vertical scroll amount of a mouse wheel (y-axis)

deltaZ: Returns the scroll amount of a mouse wheel for the z-axis

deltaMode: Returns a number that represents the unit of measurements for delta values (pixels, lines or pages)

For example you can call event.deltaY to get the amount of scrolling in Y direction