mousewheel 與 DOMMouseScroll

FF使用DOMMouseScroll，其他瀏覽器都是用mousewheel

FF下有個特殊屬性event.detail，表示滾動的值

event.detail

正數：向下滾動，負數：向上滾動

滾動一次值3，向上滾動一頁值爲-32768，向下滾動一頁值爲+32768，其他值代表滾動的行數, 方向代表了數值的正負號

受信任的事件是不會給detail賦值0

其他瀏覽器，通過event.wheelDelta獲取滾動值

正數：向上滾動，負數：向下滾動

滾動一次值120

1. //非FF
2. //event.wheelDelta
3. // 正數:向上滾動，負數：向下滾動
4. // 滾動一次值120
5. document.body.onmousewheel = function (event) {
6. event = event || window.event;
7. log('onmousewheel');
8. log(event);
9. log('event.detail=' + event.detail);//0
10. log('event.wheelDelta=' + event.wheelDelta);
11. };
13. //FF
14. // event.detail
15. // 正數：向下滾動，負數：向上滾動
16. // 向上滾動一頁值爲-32768，向下滾動一頁值爲+32768，其他值代表滾動的行數, 方向代表了數值的正負號
17. // 受信任的事件是不會給detail賦值0
18. document.body.addEventListener("DOMMouseScroll", function (event) {
19. log('DOMMouseScroll');
20. log(event);
21. log(event.detail);
22. });
24. function log(arg) {
25. window.console && window.console.log(arg);
26. }

參考資料

https://developer.mozilla.org/en-US/docs/Web/Events/DOMMouseScroll

https://developer.mozilla.org/en-US/docs/Web/Events/mousewheel