dotimeout不能正常工作

Question

我想使用dotimeout插件來創建延遲顯示子導航時，懸停在頂級導航欄上的效果。當活動類被添加到第一個li但是當被添加到隨後的li的時候，插件似乎工作得很好，它停止顯示隱藏的ul這個在活動li之上。

這裏是我的腳本：

$(function(){ 

    $('ul.main-nav').each(function(){ 
     var nav = $(this); 

     nav 
     .mouseover(function(e){ 
      nav.doTimeout('main-nav', 500, over, e.target); 
     }).mouseout(function(){ 
      nav.doTimeout('main-nav', 500, out); 
     }); 

     function over(elem) { 
      var parent = $(elem).closest('li.main-nav'); 

      out(parent); 
      parent.children('a').addClass('hover'); 
      parent.children('ul:hidden').slideDown('fast'); 
     }; 

     function out(elem) { 
      var parents = elem 
       ? $(elem).closest('li.main-nav').siblings() 
       : nav.children(); 

      if (nav.is('.main-nav-horizontal')) { 
       parents = parents.not('.active'); 
      } 

      parents.children('a').removeClass('hover'); 
      parents.children('ul').hide(); 
     }; 
    }); 

}); 

Here's my jsfiddle

我可以看到人們在使用這個插件，所以這個問題似乎應該很容易解決，但一切就我所看到應能正常工作。

Answer 1

改變你的功能。

function out(elem) { 

    var parents; 

    if (elem) { 
    parents = $(elem).closest('li.main-nav').siblings(); 
    } 
    else { 
    parents = nav.children(); 
    showthisone = parents.filter('.active'); 
    parents = parents.not('.active'); 
    } 

    parents.children('a').removeClass('hover'); 
    parents.children('ul').hide(); 

    if (!elem) { 
    showthisone.children('a').addClass('hover'); 
    showthisone.children('ul').show(); 
    } 

};