Hoverintent延遲無法在html頁面中工作

當我申請到html頁面時，Hoverintent不起作用。幫幫我！在jsfddle上有效，但在html頁面上測試不起作用。Hoverintent延遲無法在html頁面中工作

不html的網頁上工作（下面的代碼是一樣http://jsfiddle.net/GZV5V/3/）

<html> 

    <head> 
     <style type="text/css"> 
      #nav { 
       padding: 40px; 
       border: solid #999 1px; 
      } 
      #nav ul { 
       margin: 0; 
       padding: 0; 
       display: none; 
       background-color: #CCC; 
      } 
      #nav ul li { 
       margin: 0; 
       list-style: none; 
       list-style-type: none; 
       padding: 5px; 
       width: 40px; 
      } 
      #nav a { 
       color: black; 
       text-decoration: none; 
       padding: 5px; 
      } 
      #nav a:hover { 
       text-decoration: none; 
       background-color: yellow; 
      } 
       
     </style> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
     <script type="text/javascript" src="http://cherne.net/brian/resources/jquery.hoverIntent.js"></script> 
     <script> 
      var config = { 
       over: function() { //onMouseOver callback (REQUIRED) 
        $('ul', this).slideDown(250); //show its submenu 

       }, 
       timeout: 500, // milliseconds delay before onMouseOut (default 0) 
       out: function() { // function = onMouseOut callback (REQUIRED) 
        $('ul', this).slideUp(500); //hide its submenu   
       } 
      }; 
      $('#nav li').hoverIntent(config); 
     </script> 
    </head> 

    <body> 
     <ul id="nav"> 
      <li><a href="#">Main</a> 

       <ul> 
        <li><a href="#">AAAAA</a> 
        </li> 
        <li><a href="#">BBBBB</a> 
        </li> 
        <li><a href="#">CCCCC</a> 
        </li> 
        <li><a href="#">DDDDD</a> 
        </li> 
        <li><a href="#">FFFFF</a> 
        </li> 
       </ul> 
      </li> 
     </ul> 
    </body> 

</html>

來源

2012-11-26 Phillip

的DOM尚未加載。包裝你的代碼在一個$(document).ready：

$(document).ready(function() { 
    var config = {  
     over: function() { //onMouseOver callback (REQUIRED) 
      $('ul', this).slideDown(250);//show its submenu 
     },  
     timeout: 500, // milliseconds delay before onMouseOut (default 0) 
     out: function() { // function = onMouseOut callback (REQUIRED) 
      $('ul', this).slideUp(500); //hide its submenu   
     }  
    }; 
    $('#nav li').hoverIntent(config); 
});

您已配置的jsfiddle運行代碼onLoad（見「框架」下的配置）。這就是它在小提琴中奏效的原因。

來源

2012-11-27 00:18:34

嗨安德魯，謝謝你的指針和你的符號。 – Phillip

@Phillip：沒問題！很高興我能幫上忙。 –

Hoverintent延遲無法在html頁面中工作

回答

相關問題