wheel イベントが返す event.deltaY の値が、ブラウザによって割と異なっていたという話です。
el.addEventListener('wheel', function(event) {
console.log(event.deltaY); // この値
});
実際に手動で心をこめて動かした結果を元にしており、何か間違っていたらすみません。
Chrome
- 値は必ず 0 から始まり、0 で終了する
- e.g.
[0, 1, 3, 5, 7, 8, 6, 0] - スクロール方向に可動幅がない場合も、ホイールに掛かった慣性通りにイベントが発火する
IE10, IE11
- 値は必ず 0 以外から始まり、0 以外で終了する
- 値には小数点以下が含まれる
- e.g. [1.11, 3.33, 5.55, 7.77, 8.88, 6.66]
- スクロール方向に可動幅がない場合も、ホイールに掛かった慣性通りにイベントが発火する（Chromeと同じ）
- 下スクロールを行った時に、数値にマイナス（=本来と逆の値）が含まれることがある
- 上方向は試してないけど、多分発生するのではないか
Safari
- 値は必ず 0 以外から始まり、0 以外で終了する
- e.g.
[1, 3, 5, 7, 8, 6] - スクロール方向に可動幅がない場合は、1イベントしか発火しない
Firefox
担当サービスでシェアが5%くらいだったので調べませんでした