我們都見過這些效果，用滑鼠滾輪實現某個表單內的數字增加減少操作，或者滾輪控制某個按鈕的左右，上下滾動。這些都是透過js對滑鼠滾輪的事件監聽來實現的。今天這裡介紹的是一點簡單的js對於滑鼠滾輪事件的監聽。
不同瀏覽器不同的事件
首先，不同的瀏覽器有不同的滾輪事件。主要是有兩種，onmousewheel（firefox不支援）和DOMMouseScroll（只有firefox支援），關於這兩個事件這裡不做詳述，想要了解的朋友請移步：滑鼠滾輪(mousewheel)和DOMMouseScroll事件。
另外在操作的過程中需要加入事件監聽，程式碼如下：相容firefox採用addEventListener監聽
複製程式碼
程式碼如下:
/*註冊事件*/
if(document.addEventListener){document.addEventListener('DOMMouseScroll',scrollFunc,false);
}//W3Cwindow .onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome
js回傳數值判斷滾輪上下
判斷滾輪向上或向下在瀏覽器中也要考慮相容性，現在五大瀏覽器（IE、Opera、Safari、Firefox、Chrome）中Firefox 使用detail，其餘四類使用wheelDelta；兩者只在取值不一致，代表意義一致，detail與wheelDelta只各取兩個值，detail只取±3，wheelDelta只取±120，其中正數表示為向上，負數表示向下。
具體的程式碼如下：複製程式碼
程式碼如下:
程式碼如下:
(IE/Opera)
}//W3C windowonmooew>window //IE/Opera/Chrome
複製程式碼
程式碼如下:
在非firefox瀏覽器中，滾輪向上返回的滾動數值是120，向下滾動返回-120
而在firefox瀏覽器中，滾輪向上滾動返回的數值是-3，向下滾動返回3
代碼部分如下，e.wheelDelta是判斷是否為非firefox瀏覽器，e.detail為firefox瀏覽器
if(e.wheelDelta){//IE/Opera/Chrome
t1.value=e.wheelDelta;
}else if(e.detail) {//Firefoxt2.value=e.detail;}
