當鼠標離開該div一定距離時隱藏div

我在頁面上有一個div，該頁面被導航欄中的項目切換。我想要做的是當用戶的鼠標離開div的外邊界一定距離時，該div就會隱藏起來。當鼠標離開該div一定距離時隱藏div

下面是一些示例代碼：

<ul> 
    <li>This is link A</li> 
    <li>This is link C</li> 
    <li id="trigger">This is link D</li> 
</ul> 

<div id="megaMenu">This is where the menu content goes</div>

所以，當過李＃觸發用戶移動鼠標，巨型菜單滑下。我想要做的是當用戶的鼠標超出div邊界50px時，使#megaMenu向上滑動。有什麼建議麼？？

下面是我用jQuery核心：

$(document).ready(function() { 

    $('li#locations a').hover(function() { 
     $('#locationsSuperNav').slideDown(); 
    }); 

    $('.superNavClose').hover(function() { 
     $('#locationsSuperNav').slideUp('fast').removeClass("open"); 
    }); 

});

第二片的代碼（.superNavClose）的是在把一個熱點周圍的菜單時，用戶的鼠標點擊它來關閉它的嘗試。在mega菜單中有很多鏈接，所以我需要在用戶使用它時保持打開狀態。我想在鼠標離開一定距離時關閉div會很好。在此先感謝您的任何建議！

來源

2010-12-16 Mike Muller

爲什麼你會不使用填充周圍megaMenu。這很簡單，可以滿足您的需求。 – Lex 2010-12-16 15:57:02

我們遇到的是用戶離開div的速度。如果他們的鼠標快速離開，div將保持打開狀態。需要有一個完整的方法來關閉它。 – 2010-12-16 16:08:23

您可以使用handlerOut回調從懸停功能

$(document).ready(function(){ 

    $('li#locations a').hover(function(){ 
     $('#locationsSuperNav').slideDown(); 
     }, function(){ 
      $('#locationsSuperNav').slideUp('fast').removeClass("open"); 
     }); 

});

來源

2011-02-19 23:50:20 Mark

當鼠標離開該div一定距離時隱藏div

回答

相關問題