js 滑動鼠標滑輪翻頁

今天項目中用到了通過滑動鼠標滑輪觸發事件,再網上找了一些例子,在FireFox下面使用正常,但是在IE和Google等瀏覽器下使用滑動一次滑輪卻觸發了兩次事件,網上找了一些解決方案,最後選擇了一個簡單的解決方案,如果在使用的過程中出現問題,我會繼續改進。

<script type="text/javascript">
    $(document).ready(function(){
        var flag = true;
        /*鼠標滑輪滾動事件的處理*/ 
        var scrollFunc=function(e){
            var direct=0; 
            e=e || window.event; 
            if(e.wheelDelta){//IE/Opera/Chrome
                if(flag){
                    pageTurring(e.wheelDelta);
                }else{
                    flag = true;
                }
            }else if(e.detail){//Firefox 
                pagepageTurringFirefox(e.detail);
            } 
            ScrollText(direct); 
        }

        /*註冊事件*/ 
        if(document.addEventListener){
            document.addEventListener('DOMMouseScroll',scrollFunc,false);
        }
        window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome

        //其他瀏覽器翻頁,根據參數的進行翻頁(負數爲下一頁,)
        function pageTurring(e){
            flag = false;
            alert(e);
        }
        //火狐翻頁,根據參數的進行翻頁(正數爲下一頁,)
        function pagepageTurringFirefox(e){
            alert(e);
        }
    });
</script>

有什麼問題歡迎大家提出,一起改進

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章