兩種js監(jiān)聽(tīng)滾輪事件的實(shí)現(xiàn)方法

字號(hào):


    下面小編就為大家?guī)?lái)一篇兩種js監(jiān)聽(tīng)滾輪事件的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。
    前段時(shí)間在寫(xiě)前端的時(shí)候,需要監(jiān)聽(tīng)瀏覽器的滾輪事件
    網(wǎng)上查了一下,找到兩種監(jiān)聽(tīng)滾輪事件的方法:
    一、原生js通過(guò)window.onscroll監(jiān)聽(tīng)
    //window.onscroll = function() {//為了保證兼容性,這里取兩個(gè)值,哪個(gè)有值取哪一個(gè)  var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
    //scrollTop就是觸發(fā)滾輪事件時(shí)滾輪的高度
    }
    二、Jquery通過(guò)$(window).scroll()監(jiān)聽(tīng)
    $(window).scroll(function(){//為了保證兼容性,這里取兩個(gè)值,哪個(gè)有值取哪一個(gè)  var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;  //scrollTop就是觸發(fā)滾輪事件時(shí)滾輪的高度});
    監(jiān)聽(tīng)到了滾輪事件,就可以實(shí)時(shí)地獲取到滾輪的高度,通過(guò)判斷滾輪高度等等一些流程控制,可以實(shí)現(xiàn)一些基于滾輪的特效,如:滾輪到底時(shí)異步加載數(shù)據(jù)、滾輪高度為0時(shí)頭部固定而到一定高度時(shí)頭部fixed浮動(dòng)等等一些特效
    以上這篇兩種js監(jiān)聽(tīng)滾輪事件的實(shí)現(xiàn)方法就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考