jQuery懸停淡出/淡出/ slidetoggle

當我onhover我可以得到我需要的效果，但當我將鼠標移動到「我的列表」a標記，#bb div消失。我怎麼能讓它停留在那裏，因爲我需要點擊它。jQuery懸停淡出/淡出/ slidetoggle

HTML：

<div id="aa">click</div> 
<div id="bb"> <a href="">my list</a></div>

的jQuery：

$('#bb').hide(); 
$('#aa').hover(function(){ 
    $('#bb').slideToggle(); 
});

這裏

在線樣本 - http://jsfiddle.net/9tjZK/

來源

2013-04-04 olo

'一個{背景：透明;}' – Ohgodwhy 2013-04-04 09:22:41

工作的jsfiddle這裏 - http://jsfiddle.net/9tjZK/7/。

HTML：

<div id="container"> 
<div id="aa">click</div> 
<div id="bb"> <a href="">my list</a></div> 
</div>

的jQuery：

$('#bb').hide(); 
$('#aa').mouseenter(function(){ 
    $('#bb').fadeIn(); 
}); 

$('#container').mouseleave(function(){ 
    $('#bb').fadeOut(); 
});

來源

2013-04-04 09:29:49 lifetimes

更好的解決方案:-)非常感謝 – olo 2013-04-04 09:32:22

更改您的HTML，所以錨是你綁定的元素中鼠標輸入/離開事件：

<div id="aa">click 
    <div id="bb"> 
     <a href="">my list</a> 
    </div> 
</div>

FIDDLE

來源

2013-04-04 09:26:33 adeneo

這完美地工作。我總是用這種方式..你不需要編寫額外的代碼 – 2013-04-04 09:32:47

你的HTML改成這樣：

<div id="wrapper"> 
    <div id="aa">click</div> 
    <div id="bb"> <a href="">my list</a></div> 
</div>

和jQuery代碼：

$('#bb').hide(); 

$("#wrapper").hover(
    function() { 
    $('#bb').stop(true, true).slideDown(); 
    }, 
    function() { 
    $('#bb').stop(true, true).fadeOut(); 
    } 
);

演示：http://jsfiddle.net/9tjZK/9/

來源

2013-04-04 09:31:21 Eli

olo，你可以嘗試使用點擊事件比懸停，這會給你想要的結果。

you can check here http://jsfiddle.net/9tjZK/8/

來源

2013-04-04 09:33:07 dreamweiver

jQuery懸停淡出/淡出/ slidetoggle

回答

相關問題