El interface WheelEvent retrata los eventos que ocurren cuando el usuario mueve la rueda del ratón o de un dispositivo similar.
Esta es la forma estándar de usar el evento wheel.
Antiguas versiones de navegadores implementaron dos formas no-estándar y no-compatibles-entre-navegadores, los interfaces MouseWheelEvent y MouseScrollEvent. Utilice este interfaz y evite los dos últimos.
<div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveAspectRatio="xMinYMin meet"><a xlink:href="https://developer.mozilla.org/es/docs/Web/API/Event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="38.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#D4DDE4" fill="none"/><line x1="86" y1="25" x2="116" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/es/docs/Web/API/UIEvent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">UIEvent</text></a><polyline points="191,25 201,20 201,30 191,25" stroke="#D4DDE4" fill="none"/><line x1="201" y1="25" x2="231" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/es/docs/Web/API/MouseEvent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="281" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">MouseEvent</text></a><polyline points="331,25 341,20 341,30 331,25" stroke="#D4DDE4" fill="none"/><line x1="341" y1="25" x2="371" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/es/docs/Web/API/WheelEvent" target="_top"><rect x="371" y="1" width="100" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text x="421" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">WheelEvent</text></a></svg></div>
a:hover text { fill: #0095DD; pointer-events: all;}
Constructor
WheelEvent()- Crea el objeto
WheelEvent.
Propiedades
Este interfaz hereda propiedades de estos padres, MouseEvent, UIEvent y Event.
WheelEvent.deltaXRead only- Devuelve un doble (número de doble precisión) que representa la cantidad de desplazamiento horizontal.
WheelEvent.deltaYRead only- Devuelve un doble que representa la cantidad de desplazamiento vertical.
WheelEvent.deltaZRead only- Devuelve un doble que representa la cantidad de desplazamiento del eje-z.
WheelEvent.deltaModeRead only- Devuelve un entero largo sin signo que representa la unidad manejada por los valores de cantidad de desplazamiento delta. Los valores permitidos son:
Constant Value Description DOM_DELTA_PIXEL0x00Los valores delta están especificados en pixeles. DOM_DELTA_LINE0x01Los valores delta están especificados en líneas. DOM_DELTA_PAGE0x02Los valores delta están especificados en páginas.
Métodos
Este interfaz no define ningún método, pero hereda métodos de estos padres, MouseEvent, UIEvent y Event.
Especificaciones
| Especificación | Estatus | Comentario |
|---|---|---|
| Document Object Model (DOM) Level 3 Events Specification The definition of 'WheelEvent' in that specification. |
Working Draft | Definición inicial. |
Compatibilidad en navegadores
| Característica | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|---|
| Implementación básica | 31 | (Yes) | 17.0 (17.0) | 9.0 | 18 | 7.0 |
window.WheelEvent |
(Yes) | (Yes) | 17.0 (17.0) | 9.0 | (Yes) | (Yes) [1] |
| Característica | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Implementación básica | (Yes) | 17.0 (17.0) | ? | (Yes) | Not supported |
window.WheelEvent |
(Yes) | 17.0 (17.0) | ? | (Yes) | ? |
[1] Safari no implementa actualmente WheelEvent actually; sin embargo este devuelve un objeto para window.WheelEvent.
Ver también
wheel- Interfaces reemplazados por este:
- Objeto del evento de la rueda del ratón legado de la plataforma Gecko:
MouseScrollEvent - Navegadores no-gecko, objeto del evento de la rueda del ratón legado:
MouseWheelEvent
- Objeto del evento de la rueda del ratón legado de la plataforma Gecko: