js基礎 滾輪的事件

2022-10-08 20:36:15 字數 580 閱讀 8592

滑鼠滾輪滾動的事件,會在滾輪滾動時觸發,但是火狐不支援該屬性。

在火狐中需要使用dommousescroll來繫結滾動事件,注意該事件需要通過addeventlistener()函式來繫結

該屬性可以獲取滑鼠滾動的方向,向上滾值為120,向下滾值為-120,wheeldelta這個值我們不看大小,只看正負。

比如:(event.wheeldelta)

wheeldelta這個屬性火狐中不支援,在火狐中使用detail屬性來獲取滾動的方向,向上滾-3,向下滾3。(event.detail)

當滾輪滾動時,如果瀏覽器有滾動條,滾動條會隨之滾動,這是瀏覽器的預設行為,如果不希望發生瀏覽器的預設行為,則可以取消預設行為,方法,在給元素繫結滾動時,最後return false;即可

使用addeventlistener()方法繫結響應函式,取消預設行為時不能使用return false;

需要使用event來取消預設行為event.preventdefault()。

但是ie8不支援event.preventdefault();,如果直接呼叫會報錯。

JS滑鼠滾輪事件詳解

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

JS滑鼠滾輪事件詳解

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

js滑鼠滾輪事件相容

ie6.0首先實現了滑鼠的滾輪事件,其良好的互動效果得到認可,隨後opera chrome safari等主流瀏覽器都實現了該效果,不過存在著很大的相容問題。大多數瀏覽器支援mousewheel事件操作,它可以在任何元素上觸發,最終冒泡到document或window物件 而在firefox中,支援...