WheelEvent

WheelEvent インターフェイスは、ユーザーがマウスホイールやそれに似た機器を動かしたときに発行されるイベントを表します。

重要: これは標準のホイールイベントインターフェイスです。古いバージョンのブラウザーは、標準外でブラウザー間の互換性のない MouseWheelEvent および MouseScrollEvent インターフェイスを実装していました。これらを避けて、このインターフェイスを使用してください。

注: wheel イベントと scroll イベントを混同しないでください。 wheel イベントの既定のアクションは実装固有のものです。したがって、 wheel イベントは必ずしも scroll イベントを発行するわけではありません。その場合でも、 wheel イベントの delta* 値は必ずしもコンテンツのスクロール方向を反映しているとは限りません。したがって、スクロールの方向を取得するために、 wheel イベントの delta* プロパティに頼らないようにしてください。代わりに、 scroll イベント内のターゲットの scrollLeftscrollTop の値の変化を検出するようにしてください。

コンストラクター

WheelEvent()
WheelEvent オブジェクトを生成します。

プロパティ

このインターフェイスは、その祖先である MouseEvent, UIEvent, Event からプロパティを継承しています。

WheelEvent.deltaX読取専用
水平方向のスクロール量を表す double を返します。
WheelEvent.deltaY読取専用
垂直方向のスクロール量を表す double を返します。
WheelEvent.deltaZ読取専用
Z 軸方向のスクロール量を表す double を返します。
WheelEvent.deltaMode読取専用
スクロール量の差分値の単位を表す unsigned long を返します。許容値は以下のとおりです:
定数 説明
DOM_DELTA_PIXEL 0x00 delta* はピクセル数で指定されます。
DOM_DELTA_LINE 0x01 delta* は行数で指定されます。
DOM_DELTA_PAGE 0x02 delta* はページ数で指定されます。

メソッド

このインターフェイスではメソッドが定義されていませんが、祖先である MouseEvent, UIEvent, Event のメソッドを継承しています。

仕様書

仕様書 状態 備考
UI Events
The WheelEvent interface の定義
草案
Document Object Model (DOM) Level 3 Events Specification
WheelEvent の定義
廃止された 初回定義

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
WheelEventChrome 完全対応 31Edge 完全対応 12Firefox 完全対応 17IE 完全対応 9Opera 完全対応 18Safari 完全対応 6.1WebView Android 完全対応 ありChrome Android 完全対応 ありFirefox Android 完全対応 17Opera Android 完全対応 ありSafari iOS 未対応 なしSamsung Internet Android 完全対応 あり
WheelEvent() constructorChrome 完全対応 ありEdge 完全対応 ≤18Firefox 完全対応 17IE 未対応 なしOpera 完全対応 ありSafari 完全対応 6.1WebView Android 完全対応 ありChrome Android 完全対応 ありFirefox Android 完全対応 17Opera Android 完全対応 ありSafari iOS 未対応 なしSamsung Internet Android 完全対応 あり
deltaModeChrome 完全対応 31Edge 完全対応 12Firefox 完全対応 17IE 完全対応 9Opera 完全対応 18Safari 完全対応 6.1WebView Android 完全対応 ありChrome Android 完全対応 ありFirefox Android 完全対応 17Opera Android 完全対応 ありSafari iOS 未対応 なしSamsung Internet Android 完全対応 あり
deltaXChrome 完全対応 31Edge 完全対応 12Firefox 完全対応 17IE 完全対応 9
補足
完全対応 9
補足
補足 IE9 supports an old draft of the spec where this value was a long instead of a double.
Opera 完全対応 18Safari 完全対応 6.1WebView Android 完全対応 ありChrome Android 完全対応 ありFirefox Android 完全対応 17Opera Android 完全対応 ありSafari iOS 未対応 なしSamsung Internet Android 完全対応 あり
deltaYChrome 完全対応 31Edge 完全対応 12Firefox 完全対応 17IE 完全対応 9
補足
完全対応 9
補足
補足 IE9 supports an old draft of the spec where this value was a long instead of a double.
Opera 完全対応 18Safari 完全対応 6.1WebView Android 完全対応 ありChrome Android 完全対応 ありFirefox Android 完全対応 17Opera Android 完全対応 ありSafari iOS 未対応 なしSamsung Internet Android 完全対応 あり
deltaZChrome 完全対応 31Edge 完全対応 12Firefox 完全対応 17IE 完全対応 9
補足
完全対応 9
補足
補足 IE9 supports an old draft of the spec where this value was a long instead of a double.
Opera 完全対応 18Safari 完全対応 6.1WebView Android 完全対応 ありChrome Android 完全対応 ありFirefox Android 完全対応 17Opera Android 完全対応 ありSafari iOS 未対応 なしSamsung Internet Android 完全対応 あり
Pinch-to-zoom maps to WheelEvent + ctrl key.Chrome 完全対応 31Edge 完全対応 ≤79Firefox 完全対応 55IE ? Opera ? Safari 未対応 なしWebView Android 完全対応 ありChrome Android 完全対応 ありFirefox Android 完全対応 55Opera Android ? Safari iOS 未対応 なしSamsung Internet Android 完全対応 あり

凡例

完全対応  
完全対応
未対応  
未対応
実装状況不明  
実装状況不明
実装ノートを参照してください。
実装ノートを参照してください。

関連情報

  • wheel イベント
  • 置き換えたインターフェイス:
    • Gecko の古いマウスホイールイベントオブジェクト: MouseScrollEvent
    • Gecko 以外のブラウザーの古いマウスホイールイベントオブジェクト: MouseWheelEvent