PointerEvent

PointerEvent インターフェイスは、接触点のジオメトリ、イベントを生成したデバイスタイプ、接触面に加えられた圧力の量など、ポインタによって生成された DOM イベントの状態を表します。

ポインタは、入力デバイス(マウス、ペン、またはタッチ対応面上の接触点など)のハードウェアにとらわれない表現です。 ポインタは、画面などの接触面上の特定の座標(または座標のセット)をターゲットにすることができます。

ポインタのヒットテストは、ブラウザーがポインタイベントのターゲット要素を決定するために使用するプロセスです。 通常、これはポインタの位置と、画面媒体上のドキュメント内の要素の視覚的なレイアウトを考慮して決定します。

コンストラクタ

PointerEvent()
信頼できない合成 PointerEvent を作成します。

プロパティ

このインターフェイスは、MouseEvent および Event からプロパティを継承します。

PointerEvent.pointerId 読取専用
イベントの原因となっているポインタの一意の識別子。
PointerEvent.width 読取専用
ポインタの接触ジオメトリの幅(X 軸の大きさ、CSS ピクセル単位)。
PointerEvent.height 読取専用
ポインタの接触ジオメトリの高さ(Y 軸上の大きさ、CSS ピクセル単位)。
PointerEvent.pressure 読取専用
0 から 1 の範囲のポインタ入力の正規化された圧力。 ここで、0 と 1 は、それぞれハードウェアが検出できる最小圧力と最大圧力を表します。
PointerEvent.tangentialPressure 読取専用
ポインタ入力の正規化された接線圧力(バレル圧力またはシリンダー応力(cylinder stress)とも呼ばれます)は -1 から 1 の範囲で、0 はコントロールの中立位置です。
PointerEvent.tiltX 読取専用
Y-Z 平面と、ポインタ(ペン/スタイラスなど)軸と Y 軸の両方を含む平面との間の平面角度(度単位、-90 から 90 の範囲)。
PointerEvent.tiltY 読取専用
X-Z 平面と、ポインタ(ペン/スタイラスなど)軸と X 軸の両方を含む平面との間の平面角度(度単位、-90 から 90 の範囲)。
PointerEvent.twist 読取専用
ポインタ(ペン/スタイラスなど)の長軸を中心とした時計回りの回転の度数(0 から 359の範囲の値)。
PointerEvent.pointerType 読取専用
イベントの原因となったデバイスタイプ(マウス、ペン、タッチなど)を示します。
PointerEvent.isPrimary 読取専用
ポインタがこのポインタタイプのプライマリポインタを表すかどうかを示します。

メソッド

PointerEvent.getCoalescedEvents() これは非推奨の API です。まだ動作しているかもしれませんが、もう使用するべきではありません。
送出された pointermove イベントに合体したすべての PointerEvent インスタンスのシーケンスを返します。

ポインタイベントタイプ

PointerEvent インターフェイスにはいくつかのイベントタイプがあります。 どのイベントが発生したかを判断するには、イベントの type プロパティを調べます。

: 多くの場合、ポインタとマウスの両方のイベントが送信されることに注意することが重要です(ポインタ固有でないコードでもユーザーと対話できるようにするため)。 ポインタイベントを使用する場合は、event.preventDefault() を呼び出してマウスイベントも送信されないようにする必要があります。
pointerover
このイベントは、ポインティングデバイスが要素のヒットテスト境界内に移動したときに発生します。
pointerenter
このイベントは、ポインティングデバイスが要素またはその子孫の1つのヒットテスト境界内に移動したときに発生します。 これには、ホバーをサポートしないデバイスからの pointerdown イベントの結果も含まれます(pointerdown を参照)。 このイベントタイプは pointerover に似ていますが、バブリングしないという点で異なります。
pointerdown
このイベントは、ポインタがアクティブになると発生します。 マウスの場合、ボタンが押されていない状態から少なくとも1つのボタンが押された状態に移行したときに発生します。 タッチの場合、物理的な接触がデジタイザとなされたときに発生します。 ペンの場合、スタイラスがデジタイザと物理的に接触したときに発生します。
pointermove
このイベントは、ポインタが座標を変更したときに発生します。
pointerup
このイベントは、ポインタがアクティブでなくなったときに発生します。
pointercancel
ブラウザーは、ポインタがイベントを生成できなくなったと判断した場合(例えば、関連するデバイスが無効になった場合)、このイベントを発生させます。
pointerout
このイベントは、次のようないくつかの理由で発生します。 ポインティングデバイスが要素のヒットテスト境界外に移動した。 ホバーをサポートしていないデバイスの pointerup イベントが発生した(pointerup を参照)。 pointercancel イベントの発生後(pointercancel を参照)。 ペン/スタイラスがデジタイザで検出可能なホバー範囲を離脱したとき。
pointerleave
このイベントは、ポインティングデバイスが要素のヒットテスト境界外に移動したときに発生します。 ペンデバイスの場合、このイベントは、スタイラスがデジタイザで検出可能なホバー範囲を離脱したときに発生します。
gotpointercapture
このイベントは、要素がポインタキャプチャを受け取ったときに発生します。
lostpointercapture
このイベントは、ポインタに対するポインタキャプチャが解放された後に発生します。

GlobalEventHandlers

GlobalEventHandlers.onpointerover
pointerover イベントのためのグローバルイベントハンドラ
GlobalEventHandlers.onpointerenter
pointerenter イベントのためのグローバルイベントハンドラ
GlobalEventHandlers.onpointerdown
pointerdown イベントのためのグローバルイベントハンドラ
GlobalEventHandlers.onpointermove
pointermove イベントのためのグローバルイベントハンドラ
GlobalEventHandlers.onpointerup
pointerup イベントのためのグローバルイベントハンドラ
GlobalEventHandlers.onpointercancel
pointercancel イベントのためのグローバルイベントハンドラ
GlobalEventHandlers.onpointerout
 pointerout イベントのためのグローバルイベントハンドラ
GlobalEventHandlers.onpointerleave
pointerleave イベントのためのグローバルイベントハンドラ

各プロパティ、イベントタイプ、およびグローバルイベントハンドラの例は、それぞれの参照ページに含まれています。

仕様

仕様 状態 コメント
Unknown
PointerEvent の定義
不明 getCoalescedEvents() メソッドを追加しました。
Pointer Events – Level 2
PointerEvent の定義
勧告 twist プロパティと tangentialPressure プロパティを追加しました。
Pointer Events
PointerEvent の定義
廃止 初期定義

ブラウザーの互換性

BCD tables only load in the browser

関連情報