Question

我有以下的html：

 <div class="col-sm-12" id='dropdown_menu_group'> 
     <div id='dropdown_library_menu'> 
      <div class="row" id='dropdown_menu_row'> 
       <div class="col-sm-2"> 
        <a class='button-text btn' id='library_button' href="{{pathFor 'library'}}">my library</a> 
       </div> 
       <div class='col-sm-2 col-sm-pull-1' id='google_drive_text'> 
        GOOGLE DRIVE 
       </div> 
       <div class="col-sm-2" id='settings_button'></div> 
      </div> 
     </div> 
     <div id='dropdown_library_menu_border'></div> 
    </div> 

我id='dropdown_library_menu'默認是隱藏的，它下面<div id='dropdown_library_menu_border'></div>的div有0透明度，這樣，當它被滾動過，它會使id='dropdown_library_menu'下滑。但問題是，當菜單向下滑動時，<div id='dropdown_library_menu_border'></div>仍然存在，因此，當我滾動觸發slideDown的不透明度0 div（菜單內部，此時），它會欺騙我的jQuery，條件得到滿足：

'mouseout #dropdown_library_menu': function(ev){ 
    ev.preventDefault(); 
    $('#dropdown_library_menu').slideUp('slow'); 
} 

因爲從技術上講，我將鼠標移出下拉菜單並進入下拉菜單觸發器。

我想讓空白的div移動到菜單底部，當slideDown被觸發，但父母設置爲position relative，孩子的position absolute完全弄亂了我的網頁。

Answer 1

你可以把它更慢，

'mouseout #dropdown_library_menu': function(ev){ 
ev.preventDefault(); 
$('#dropdown_library_menu').slideUp(3000); // Slide up in 3 seconds, 
}