HTML5でマウスホイールがスクロールされているときに実行されるスクリプトのイベントonmousewheel

ホイールイベント Firefox では DOMMouseScroll を使用しますが、ff では addEventListener メソッドを使用して DomMouseScroll イベントをバインドすることもできます。また、他のブラウザではホイール イベントにマウスホイールを使用します。詳細。

Firefox は DOMMouseScroll を使用し、他のブラウザはマウスホイールを使用します。スクロール イベントがトリガーされると、Firefox は詳細 属性 を使用してホイール情報を取得し、他のブラウザーは WheelDelta を使用します。なぜ他のメーカーがこの問題に関して Microsoft とこれほど一致しているのかわかりません。 Firefox は addEventListener メソッドを使用して DomMouseScroll イベントをバインドできます。

elem.addEventListener('DOMMouseScroll', func, false); IE およびその他の主流ブラウザは、従来のイベント バインディング モデル を使用できます。ただし、IE 独自のattachEvent メソッドは使用しないでください。他の主流ブラウザは Microsoft のメソッドを認識しません。

Firefoxのマウスホイールの上スクロールは-3、下スクロールは3

IEマウスホイールの上スクロールは120、下スクロールは-120

Safariマウスホイールの上スクロールは360、下スクロールは-360

Operaのマウスホイール最大 120 までスクロールし、-120 までスクロールダウンします

Chrome のマウス ホイールは最大 120 までスクロールし、-120 までスクロールダウンします

誰かが Safari でいくつかのテストを行いました: 「円をスクロールするだけの場合、値は +-0.1 ですもう少し速くスクロールすると (さらに数回スクロールすると)、この値も大きくなります。これは、Mac OS ではマウス ホイール加速機能があるため、ブラウザは 1 回スクロールすると 1 ピクセルスクロールし、3 回スクロールします。ブラウザは 30 ピクセルスクロールします。」同時に、彼は Camino (Gecko をベースにしたカーネル エンジン) についても研究しました。「Safari と同様 (+- 0.3 ～ +-Infinity)、Firefox と同じカーネル エンジンを使用していますが、デルタ値は + だけです」 -2.666666 Float、スクロール速度に関係なく

私のテスト後、IE/Operaは同じタイプであり、attachEventを使用してホイールイベントを追加できます

/*IE注册事件*/ 
if(document.attachEvent){  
  document.attachEvent('onmousewheel',scrollFunc);  
}

FirefoxはaddEventListenerを使用してホイールイベントを追加します

/*Firefox注册事件*/ 
if(document.addEventListener){  
  document.addEventListener('DOMMouseScroll',scrollFunc,false);  
}

Safari。と Chrome は同じタイプです

window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome

Firefox を除き、他のすべては HTML DOM を使用してイベントを追加できます。次のメソッドを使用してイベントを追加します

/*注册事件*/ 
if(document.addEventListener){  
  document.addEventListener('DOMMouseScroll',scrollFunc,false);  
}//W3C  
window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome

以上がHTML5でマウスホイールがスクロールされているときに実行されるスクリプトのイベントonmousewheelの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。