Element: pointerenter イベント

pointerenter イベントは、ポインティングデバイスが要素またはその子孫のヒットテスト領域に入ったときに発生します。ホバーに対応していない機器では pointerdown イベントの結果として移動した場合も含みます(pointerdown を参照)。

構文

このイベント名を addEventListener() などのメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。

addEventListener('pointerenter', (event) => {});

onpointerenter = (event) => { };

イベント型

イベントプロパティ

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

PointerEvent.pointerId 読取専用

イベントを発生させたポインターの固有の識別子です。

PointerEvent.width 読取専用

ポインターが接触するジオメトリーの幅(X 軸の大きさ、CSS ピクセル単位)。

PointerEvent.height 読取専用

ポインターが接触するジオメトリーの高さ(Y 軸の大きさ、CSS ピクセル単位)。

PointerEvent.pressure 読取専用

ポインター入力の正規化された圧力で、範囲は 0 から 1 です。ここで 01 は、それぞれハードウェアが検出可能な最小圧力と最大圧力を表します。

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 読取専用

このポインターがこのポインター種別の主ポインターを表すかどうかを示します。

addEventListener() を使用した例です。

const para = document.querySelector('p');

para.addEventListener('pointerenter', (event) => {
  console.log('Pointer entered element');
});

onpointerenter イベントハンドラープロパティを使用した例です。

const para = document.querySelector('p');

para.onpointerenter = (event) => {
  console.log('Pointer entered element');
};

仕様書

Specification
Pointer Events
# the-pointerenter-event
Pointer Events
# dom-globaleventhandlers-onpointerenter

ブラウザーの互換性

BCD tables only load in the browser

関連情報