解析javascript中鼠標滾輪事件_javascript技巧
來源:懂視網
責編:小采
時間:2020-11-27 21:38:41
解析javascript中鼠標滾輪事件_javascript技巧
解析javascript中鼠標滾輪事件_javascript技巧:所有的現代瀏覽器都支持鼠標滾輪,并且在用戶滾動滾輪時觸發時間。瀏覽器通常使用鼠標滾輪滾動或縮放文檔,但可以通過取消mousewheel事件來阻止這些默認操作。有一些互用性問題影響滾輪事件,但是編寫跨平臺的代碼依舊可以行。除了Firefox之外的所有瀏覽器都
導讀解析javascript中鼠標滾輪事件_javascript技巧:所有的現代瀏覽器都支持鼠標滾輪,并且在用戶滾動滾輪時觸發時間。瀏覽器通常使用鼠標滾輪滾動或縮放文檔,但可以通過取消mousewheel事件來阻止這些默認操作。有一些互用性問題影響滾輪事件,但是編寫跨平臺的代碼依舊可以行。除了Firefox之外的所有瀏覽器都
所有的現代瀏覽器都支持鼠標滾輪,并且在用戶滾動滾輪時觸發時間。瀏覽器通常使用鼠標滾輪滾動或縮放文檔,但可以通過取消mousewheel事件來阻止這些默認操作。有一些互用性問題影響滾輪事件,但是編寫跨平臺的代碼依舊可以行。除了Firefox之外的所有瀏覽器都支持“mousewheel”事件,但Firefox使用“DOMMouseScroll”,而3級DOM事件規范草案建議使用事件名“wheel”替代“mousewheel”。
Firefox不支持mousewheel
以下滾輪向下滾動是chrome和IE9下面控制臺輸出


以下是滾輪向下滾動Firefox下面控制臺輸出


從上面輸出得出,可以使用非標準的DOMMouseScroll事件取代mousewheel,使用事件對象的detail屬性取代wheelDetal。但是,detail屬性值的縮放比率和正負符號不同于wheelDetal,detail值乘以-40和wheelDetal值相等。
在除了FireFox之外的瀏覽器下,滾動的上下滾動與否是下面這個wheelDelta有關。

根據測試,在我的win7系統下,無論IE7, IE10, Opera12,或者是safari5.1,每次往下滾動event.wheelDelta
值都是-120
.
對于FireFox瀏覽器(Opera瀏覽器也有),判斷鼠標滾動方向的屬性為event.detail
, 向下滾動值為3
.

需要注意的是,FireFox瀏覽器的方向判斷的數值的正負與其他瀏覽器是相反的。FireFox瀏覽器向下滾動是正值,而其他瀏覽器是負值。
以上所述就是本文的全部內容了,希望大家能夠喜歡。
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
解析javascript中鼠標滾輪事件_javascript技巧
解析javascript中鼠標滾輪事件_javascript技巧:所有的現代瀏覽器都支持鼠標滾輪,并且在用戶滾動滾輪時觸發時間。瀏覽器通常使用鼠標滾輪滾動或縮放文檔,但可以通過取消mousewheel事件來阻止這些默認操作。有一些互用性問題影響滾輪事件,但是編寫跨平臺的代碼依舊可以行。除了Firefox之外的所有瀏覽器都