Mouse events

概要

click / dblclick / mousedown / mouseup / mousemove / mouseenter / mouseleave などのイベントでマウス操作を処理します。

対応ブラウザ

基本構文

document.getElementById('target').addEventListener('click', (e) => {
  console.log('クリック位置:', e.clientX, e.clientY);
});
document.addEventListener('mousemove', (e) => {
  console.log('マウス移動:', e.pageX, e.pageY);
});

実務での使いどころ

• Mouse events の活用

  マウスイベント。クリック、移動、ホバーなどのマウス操作を検知するイベント群。

注意点

アクセシビリティ

• スクリーンリーダーでの読み上げを確認すること。

参考リンク

• MDN Web Docs — Mouse events