HTML | DOM WheelEvent deltaX Property
The WheelEvent.deltaX property in HTML is used to return a positive double value when the web page is scrolled horizontally along left or right direction. If the page is scrolled to right it return a positive value, and a negative double value when scrolled to the left, else it returns zero. It is a read-only property.
Syntax:
event.deltaX
Return Value: It returns a double value which indicates the scrolling direction of mouse wheel.
- A positive double value represents mouse is scrolled to right.
- A negative double value represents mouse is scrolled to left.
Example:
html
<!DOCTYPE html><html> <head> <title>DOM WheelEvent deltaX Property</title> </head> <body onwheel="Geeks(event)" style="text-align: center; width: 1000px;"> <h1 style="color: green;"> GeeksforGeeks </h1> <h2> DOM WheelEvent deltaX Property </h2> <p>Scroll to see effect:</p> <p id="p"></p> <script> function Geeks(event) { var doc = event.deltaX; document.getElementById("p").innerHTML = doc; } </script> </body></html> |
Output:
Supported Browsers: The browser supported by deltaX property are listed below:
- Apple Safari 8.0
- Google Chrome 31.0
- Edge 12.0
- Firefox 17.0
- Opera 18.0
- Internet Explorer 9
Please Login to comment...