Question

当我转发时，我可以得到我需要的效果，但是当我将鼠标移动到“我的列表”a标签时，#bb div消失了。我怎么能让它留在那里，因为我需要点击它。

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/

Answer 1

更改HTML，因此锚点位于绑定mouseenter / leave事件的元素内：

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

FIDDLE

Answer 2

将您的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/

Answer 3

在这里工作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();
});

Answer 4

olo，您可以尝试使用点击事件而不是悬停，这可以为您提供所需的结果。

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

jQuery悬停fadein / fadeout / slidetoggle

4 个答案: