onwheel Event
Example
When the user rolls the mouse wheel over a <div> element, change its font-size:
document.getElementById("myDIV").addEventListener("wheel", myFunction);
function myFunction() {
this.style.fontSize = "35px";
}
Try it Yourself »
Description
The onwheel
event occurs when the mouse wheel is rolled over an element.
The onwheel
event also occurs when the user scrolls using a touchpad.
Syntax
In JavaScript, using the addEventListener() method:
object.addEventListener("wheel", myScript);
Try it Yourself »
Technical Details
Bubbles: | Yes |
---|---|
Cancelable: | Yes |
Event type: | WheelEvent |
HTML tags: | All HTML elements |
DOM Version: | Level 3 Events |
Browser Support
onwheel
is a DOM Level 3 (2004) feature.
It is fully supported in all modern browsers:
Chrome | Edge | Firefox | Safari | Opera | IE |
Yes | Yes | Yes | Yes | Yes | 11 |