国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

JavaScript系列之鼠標滾輪事件

vspiders / 2342人閱讀

摘要：鼠標滾輪事件當在被綁定的對象上如某個或者發生鼠標滾輪滾動時觸發。

鼠標滾輪事件 
當在被綁定的對象上(如：某個div或者doucument)發生鼠標滾輪滾動時觸發。

在不同的瀏覽器中有不同的表現形式：

一、ie/chrome下的事件 :　onmousewheel

事件綁定方式：on 或者 addEventListener[attachEvent]

獲取滾輪事件具體信息：event.wheelDelta

     向上滾動up：120 
     向下滾動down: -120

二、firefox 下的事件: DOMMouseScroll

事件綁定方式：addEventListener

獲取滾輪事件具體信息：event.detail

     向上滾動up: -3
     向下滾動down: 3

/*
    封裝一個函數：
    obj  需要加鼠標滾輪事件的對象
    upFn  當滾輪向上滾動時執行的函數
    downFn  當滾輪向下滾動時執行的函數

*/

function wheel(obj,upFn,downFn) {

    if(arguments.length < 3){
        alert("Sorry,你輸入的參數不夠");
    }

    obj.onmousewheel = fn;  

    obj.addEventListener && obj.addEventListener("DOMMouseScroll",fn,false);

    function fn(ev){

        var ev = ev || window.event;

        var bool = true;

        if(ev.wheelDelta){
            bool = ev.wheelDelta > 0 ? true : false;
        }else if(ev.detail){
            bool = ev.detail < 0 ? true : false;
        }

        bool && upFn();
        (!bool) && downFn();

        //prevent(ev);

    }
}



都存在的問題



當頁面本身就存在滾動條時就會出現異常，解決辦法：阻止瀏覽器的默認行為




ie：returnValue = false
DOM：preventDefault()




/*
    阻止默認行為函數
*/
function prevent(evt){

    if(evt.preventDefault){
        evt.preventDefault();
    }else{
        evt.returnValue = false;
    }

}

//將wheel函數中的prevent(ev)前注釋去掉即可

           
               
                                           
                       
                 
            
                     
             
               

                   
 文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

                 
                   
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/87549.html

               

                      
               
              
              

                
相關文章

                
    
                             
                                                                                                    
  • 
                                                
    
                          
    JavaScript系列之事件類型
    
                                                     
    摘要：有兩種事件處理程序的方式。第一種第二種事件當調整瀏覽器的窗口到一個新的寬度或高度時，就會觸發事件。事件在元素獲得焦點時觸發。這個事件冒泡某些瀏覽器不支持。事件在鼠標光標從元素外部首次移動到元素范圍內時觸發。事件這個事件跟蹤鼠標滾輪。

JavaScript簡單入門可以看看我丑丑的Github博客JavaScript簡單入門
本文主要簡單介紹以下幾類事件：

UI事件
焦點事件
鼠標與滾輪...
    
                                                   
                          
    
                                
    
                                    chanthuang
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    JavaScript 筆記 —— 鼠標事件的瀏覽器差異
    
                                                     
    摘要：本文總結一下，鼠標事件在不同瀏覽器實現的差異。和相關元素差異和是級事件當中的其中兩個事件。標準事件對象使用屬性來識別鼠標按鍵。該事件當中的值與事件對象當中的作用相同。

鼠標是我們在 PC 端瀏覽網頁時候最重要的交互工具，因此鼠標事件也是 Web 開發當中最常用的一類事件。然而，由于各種原因，不同廠商或者不同版本的瀏覽器之間對于鼠標事件的實現也有所不同。本文總結一下，鼠標事件在不同瀏覽器...
    
                                                   
                          
    
                                
    
                                    haoguo
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    一文讀懂鼠標滾輪事件（wheelEvent）
    
                                                     
    摘要：下面正式推薦大神的博文前段時間使用做滾動條控件，添加滾輪事件時，查閱了一些資料，發現大都是文檔描述或簡單示例，對于開發者還是不夠。一測試目標探索事件中常用屬性的有效性，垂直步進算法滑動幅度以及與電腦個性化設置的關聯。

最近在用VUE寫一個后臺管理系統，頂部標簽頁涉及鼠標滾輪事件，由于每個瀏覽器對滾輪事件的處理方式不一樣，個人對這個又不懂，折騰了很久，參考了大神的代碼，也把百度翻爛了，找...
    
                                                   
                          
    
                                
    
                                    doodlewind
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    JavaScript 事件——“事件類型”中“焦點、鼠標和滾輪事件”的注意要點
    
                                                     
    摘要：焦點事件一般利用這些事件與方法和屬性配合。此外，支持一個名為的類似事件，也是在鼠標滾動滾輪時除法。

焦點事件
一般利用這些事件與document.hasFocus()方法和document.activeElement屬性配合。主要有：

blur：元素失去焦點，不會冒泡；
DOMFocusIn：同HTML事件focus，于DOM3遭廢棄，選用focusin；
DOMFocusOut：同...
    
                                                   
                          
    
                                
    
                                    clasnake
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                           
                

              

              
               

                  
                  
發表評論

                   
               

              

                

                  
0條評論
   
                
 
                      

              

           
           

              
 
                

                   
              
  

                  
最新活動
 
           
                             
              





                                
              

           

        
       
    
    
     

      
    

    
    

    
       
       

         
閱讀需要支付1元查看
  
         
     
       

      
  
    
    








        

            

              
              
            

             
        

    







<