js中的滑鼠滾輪事件

2022-08-27 22:33:18 字數 1221 閱讀 2908

##  事件物件 event

1event事件物件,表示用來獲取事件的詳細資訊,比如得到滑鼠的橫座標:事件物件.clientx(clientx是可視區座標)

window.onclick = function

(ev)

2事件物件的相容寫法

a.ie8和ie8以下瀏覽器不能傳遞引數,只能使用window.event物件。

b.谷歌瀏覽器既可以傳遞事件物件引數,也可以使用window.envent物件,十分全面。

c.火狐瀏覽器只能使用傳遞的事件物件引數。

因此針對不同瀏覽器,相容性寫法如下:

事件.事件型別 = function(ev)

## 滑鼠滾輪事件

1非火狐: mousewheel

這裡,event.wheeldelta

<0向下滾動

2火狐:dommousescroll

這裡,event.detail > 0 為向下滾動,event.detail < 0為向上滾動

3.瀏覽器相容性寫法如下:

document.onmousewheel = wheelhander;//

非火狐 document.addeventlistener('dommousescroll',wheelhander,false);//

火狐function

wheelhander(e)

else

}else

if(oevent.detail)

else}}

3案例:使用滾輪改變的大小

var img = document.getelementsbytagname('img')[0];

//非火狐實現滾輪效果

document.onmousewheel = wheelhander;//

非火狐//

火狐一家使用dommousescroll實現滾輪效果

js中滑鼠滾輪事件詳解

附加事件 其中經我測試,ie opera屬於同一型別,使用attachevent即可新增滾輪事件。ie註冊事件 if document.attachevent firefox使用addeventlistener新增滾輪事件 firefox註冊事件 if document.addeventlisten...

JS滑鼠滾輪事件詳解

文章目錄 相容性寫法,該函式也是網上別人寫的,不過找不到出處了,蠻好的,所有我也沒有必要修改了 判斷滑鼠滾輪滾動方向 if window.addeventlistener ff,火狐瀏覽器會識別該方法 window.addeventlistener dommousescroll wheel,fals...

JS滑鼠滾輪事件詳解

相容性寫法,該函式也是網上別人寫的,不過找不到出處了,蠻好的,所有我也沒有必要修改了 判斷滑鼠滾輪滾動方向 if window.addeventlistener ff,火狐瀏覽器會識別該方法 window.addeventlistener dommousescroll wheel,false win...