WheelEvent

WheelEvent 接口表示用户滚动鼠标滚轮或类似输入设备时触发的事件。

重要:该事件为标准规定的滚轮事件接口。早期的浏览器实现过MouseWheelEventMouseScrollEvent两种滚轮事件接口,但这两种接口皆非标准,加之各浏览器间对其兼容性极差。因而开发者应使用该标准事件接口取代这两个非标准接口。
不要混淆 wheel 事件和 scroll 事件:wheel 事件的默认动作取决于浏览器实现。因此 wheel 事件不一定会触发 scroll 事件。即便滚轮事件引发了文档内容的滚动行为,也不表示 wheel 事件中的 delta* 值恰好反映文档内容的滚动方向。因此,不要依赖 delta* 属性获知文档内容的滚动方向。可在文档内容滚动事件(scroll)中监视target的scrollLeftscrollTop的变化以推断滚动方向。

构造函数

WheelEvent()
创建一个WheelEvent对象。

属性

该接口继承了父接口MouseEventUIEventEvent的属性。

WheelEvent.deltaX 只读
返回double值,该值表示滚轮的横向滚动量。
WheelEvent.deltaY 只读
返回double值,该值表示滚轮的纵向滚动量。
WheelEvent.deltaZ 只读
返回double值,该值表示滚轮的z轴方向上的滚动量。
WheelEvent.deltaMode 只读
返回unsigned long值,该值表示上述各delta*的值的单位。该值及所表示的单位如下:
常量 描述
DOM_DELTA_PIXEL 0x00 滚动量单位为像素。
DOM_DELTA_LINE 0x01 滚动量单位为行。
DOM_DELTA_PAGE 0x02 滚动量单位为页。

方法

该接口本身未定义方法,但继承了父接口MouseEventUIEventEvent的方法。

规范

规范 状态 注释
UI Events
The WheelEvent interface
Working Draft
Document Object Model (DOM) Level 3 Events Specification
WheelEvent
Obsolete Initial definition.

浏览器兼容性

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
WheelEventChrome Full support 31Edge Full support 12Firefox Full support 17IE Full support 9Opera Full support 18Safari Full support 6.1WebView Android Full support YesChrome Android Full support YesFirefox Android Full support 17Opera Android Full support YesSafari iOS No support NoSamsung Internet Android Full support Yes
WheelEvent() constructorChrome Full support YesEdge Full support ≤18Firefox Full support 17IE No support NoOpera Full support YesSafari Full support 6.1WebView Android Full support YesChrome Android Full support YesFirefox Android Full support 17Opera Android Full support YesSafari iOS No support NoSamsung Internet Android Full support Yes
deltaModeChrome Full support 31Edge Full support 12Firefox Full support 17IE Full support 9Opera Full support 18Safari Full support 6.1WebView Android Full support YesChrome Android Full support YesFirefox Android Full support 17Opera Android Full support YesSafari iOS No support NoSamsung Internet Android Full support Yes
deltaXChrome Full support 31Edge Full support 12Firefox Full support 17IE Full support 9
Notes
Full support 9
Notes
Notes IE9 supports an old draft of the spec where this value was a long instead of a double.
Opera Full support 18Safari Full support 6.1WebView Android Full support YesChrome Android Full support YesFirefox Android Full support 17Opera Android Full support YesSafari iOS No support NoSamsung Internet Android Full support Yes
deltaYChrome Full support 31Edge Full support 12Firefox Full support 17IE Full support 9
Notes
Full support 9
Notes
Notes IE9 supports an old draft of the spec where this value was a long instead of a double.
Opera Full support 18Safari Full support 6.1WebView Android Full support YesChrome Android Full support YesFirefox Android Full support 17Opera Android Full support YesSafari iOS No support NoSamsung Internet Android Full support Yes
deltaZChrome Full support 31Edge Full support 12Firefox Full support 17IE Full support 9
Notes
Full support 9
Notes
Notes IE9 supports an old draft of the spec where this value was a long instead of a double.
Opera Full support 18Safari Full support 6.1WebView Android Full support YesChrome Android Full support YesFirefox Android Full support 17Opera Android Full support YesSafari iOS No support NoSamsung Internet Android Full support Yes
Pinch-to-zoom maps to WheelEvent + ctrl key.Chrome Full support 31Edge Full support ≤79Firefox Full support 55IE ? Opera ? Safari No support NoWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 55Opera Android ? Safari iOS No support NoSamsung Internet Android Full support Yes

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.

参见