このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

Element: pointerenter イベント

Baseline
広く利用可能

この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2020年7月以降、すべてのブラウザーで利用可能です。

pointerenter イベントは、ポインティングデバイスが要素またはその子孫のヒットテスト領域に入ったときに発生します。ホバーに対応していない機器では pointerdown イベントの結果として移動した場合も含みます(pointerdown を参照)。それ以外の場合、pointerenter は mouseenter と同じように動作し、同時に発生します。また、該当する場合は mouseover および pointerover イベントとも同時に発生します。

構文

addEventListener() でこのイベント名を使用してください。

js
addEventListener("pointerenter", (event) => { })

または、インターフェイスのイベントハンドラープロパティに代入します。

js
onpointerenter = (event) => { }

イベント型

PointerEvent です。 Event を継承しています。

Event UIEvent MouseEvent PointerEvent

例

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

js
const para = document.querySelector("p");

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

onpointerenter イベントハンドラープロパティを使用した例です(onpointerenter を使用して追加済みの他のイベントリスナーがある場合、それらは置き換えられます)。

js
const para = document.querySelector("p");

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

仕様書

仕様書
Pointer Events
# pointerenter
Pointer Events
# dom-globaleventhandlers-onpointerenter

ブラウザーの互換性

関連情報