jQuery的鼠標不計數鏈接作爲DIV的一部分？

對不起，如果這已被回答，但我找不到答案..jQuery的鼠標不計數鏈接作爲DIV的一部分？

我所擁有的是一個具有一些鏈接的DIV。我想要它做的是在鼠標在它上面時顯示，但在鼠標離開時淡出（DIV）。唯一的問題是，只要鼠標點擊其中的鏈接，DIV就會淡出。那麼有沒有辦法讓它意識到鏈接也是DIV的一部分，或者什麼是最好的解決方案？

這是當前的代碼：

jQuery的

$("#hoverbox").mouseover(function() { 
    $("#hoverbox").fadeOut(); 
    $("#sub-menu").fadeIn("slow"); 
}); 

$('#sub-menu').mouseout(function() { 
    $("#sub-menu").fadeOut(); 
    $("#hoverbox").fadeIn(); 
});

HTML

<div id="sub-menu"> 
<a href="test.html">test</a> 
</div> 
<div id="hoverbox"></div>

我不能有這個問題只有一個，所以我很有可能錯過了什麼這裏非常基本。

來源

2012-11-06 nyy

你能否再次重複你試圖達成的目標，如果我聽起來很厚''）'我可以幫你解決問題！乾杯！ –

+1 @Tats_innit，顯示的代碼完成預期的工作。也許更多的代碼或更好的問題解釋應該有所幫助。 – Vithozor

問題是你使用了錯誤的情況下，要使用mouseleave代替mouseout，看看下面的事件列表，您可以使用：

mouseenter/mouseout 
mouseover/mouseleave

您已經瞭解了兩個對（包括或不是內部元素）之間的差異，你是兩個組合的混合。

所以，你只需要改變你的下面一行：

$('#sub-menu').mouseout(function() {

這一個：

$('#sub-menu').mouseleave(function() {

見工作demo。

來源

2012-11-06 09:19:07 Nelson

工作得很好，我將不得不閱讀jQuery，非常感謝！ – nyy

這是接近你想要的嗎？

$("#hoverbox").mouseenter(function() { 
    $("#hoverbox").hide("slow"); 
    $("#sub-menu").show("fast"); 
}); 

$('#sub-menu').mouseleave(function() { 
    $("#sub-menu").hide(); 
    $("#hoverbox").show(); 
});

演示是在這裏：使用了mouseenter和鼠標離開http://jsfiddle.net/UTaFL/

在這裏更好，因爲他們忽略子元素，只追求鼠標進入/離開指定元素的邊界。

我還更改了fadeIn和fadeOut，因爲它們可能會導致問題，因爲它們在頁面上實際可見之前能夠調用mouseenter和mouseleave（以及mouseover和mouseout）事件。

來源

2012-11-06 09:25:34

謝謝，我會牢記你的話！ – nyy

jQuery的鼠標不計數鏈接作爲DIV的一部分？

回答

相關問題