Element: wheel event

The wheel event fires when the user rotates a wheel button on a pointing device (typically a mouse).

This event replaces the non-standard deprecated mousewheel event.

Bubbles Yes
Cancelable Yes
Interface WheelEvent
Event handler property onwheel

Note: Don't confuse the wheel event with the scroll event. The default action of a wheel event is implementation-specific, and doesn't necessarily dispatch a scroll event. Even when it does, the delta* values in the wheel event don't necessarily reflect the content's scrolling direction. Therefore, do not rely on the wheel event's delta* properties to get the scrolling direction. Instead, detect value changes of scrollLeft and scrollTop of the target in the scroll event.


Scaling an element via the wheel

This example shows how to scale an element using the mouse (or other pointing device) wheel.

<div>Scale me with your mouse wheel.</div>
body {
  min-height: 100vh;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;

div {
  width: 105px;
  height: 105px;
  background: #cdf;
  padding: 5px;
function zoom(event) {

  scale += event.deltaY * -0.01;

  // Restrict scale
  scale = Math.min(Math.max(.125, scale), 4);

  // Apply scale transform
  el.style.transform = `scale(${scale})`;

let scale = 1;
const el = document.querySelector('div');
el.onwheel = zoom;

addEventListener equivalent

The event handler can also be set up using the addEventListener() method:

el.addEventListener('wheel', zoom);


Specification Status Comment
UI Events
The definition of 'wheel' in that specification.
Working Draft

Browser compatibility

ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
wheel eventChrome Full support 61Edge Full support 12Firefox Full support 17IE Full support 9
Full support 9
Notes Internet Explorer only exposes the wheel event via addEventListener; there is no onwheel attribute on DOM objects. See IE bug 782835.
Opera Full support 48Safari Full support 7WebView Android Full support 61Chrome Android Full support 61Firefox Android Full support 17Opera Android Full support 45Safari iOS Full support 7Samsung Internet Android Full support 8.0


Full support
Full support
See implementation notes.
See implementation notes.

See also