使用jquery mousemove和setTimeout和clearTimeout來顯示/隱藏菜單

Question

我在下面粘貼了一些代碼，這些代碼似乎是在mousemove上顯示菜單的常見方法。看起來，隨着鼠標繼續移動，超時的持續時間增加。那是怎麼回事？有沒有理由爲什麼cleartimeout不會工作？

var timer; 
    $(document).mousemove(function() { 
     if (timer) { 
      clearTimeout(timer); 
      timer = 0; 
     } 

     $('.navi a, a.left, a.right').animate({top:'0px'},'fast'); 
     timer = setTimeout(function() { 
      $('.navi a, a.left, a.right').animate({top:'50px'},'fast'); 
     }, 1000) 
    }); 

Answer 1

問題是，您開始動畫，在每個mousemove事件上重複移動。由於jquery的動畫排隊，每個對同一對象的animate()的調用都會排隊，所以您最後的animate()調用延遲函數（再次移動元素）必須等到所有'up'動畫完成。

查看this fiddle快速修復