JavaScriptでスクロールホイールイベントを処理する方法


  1. addEventListenerを使用する方法:
window.addEventListener('wheel', function(event) {
  // スクロールイベントの処理
});
  1. onwheelプロパティを使用する方法:
window.onwheel = function(event) {
  // スクロールイベントの処理
};
  1. passiveオプションを使用する方法 (スクロールパフォーマンスを向上させるために推奨):
window.addEventListener('wheel', function(event) {
  // スクロールイベントの処理
}, { passive: true });

上記の方法では、wheelイベントをウィンドウ全体に対してリスナーとして追加していますが、必要に応じて他の要素にリスナーを追加することもできます。

また、eventオブジェクトを使用してスクロールイベントに関連する情報にアクセスすることができます。例えば、event.deltaYプロパティを使用すると、ホイールの回転方向に基づいたスクロール量を取得することができます。

以上がJavaScriptでスクロールホイールイベントを処理するためのいくつかの方法です。適切な方法を選択し、必要に応じて処理を追加してください。