jquery div淡入/淡出 - 在鼠标移出后保持动画效果

Question

我在菜单上遇到了一些jquery问题。

我有两个街区：

-------------------
| block1 | block2 |
-------------------

第2块最初是隐藏的。

当用户将鼠标悬停在块1上时，块2淡入，然后当用户将块1移出块1时淡出。

我有两个问题：

1）如果用户快速鼠标悬停/出/出/出/等，即使用户的鼠标不在块1上，块2也会持续淡入/淡出/进/出/等等几秒钟。 / p>

2）如果用户将鼠标移到块1上然后将鼠标移动到块2，则块2淡出 - 我需要块2保持可见。

我的jquery代码是：

$('#block1').hover(
function(){$('#block2').fadeIn()},
function(){$('#block2').fadeOut()}
);

我已经在页面上使用了jquery来获取其他效果，所以我想用jquery而不是css来做这个块2淡入和淡出。

由于

Answer 1

$('#block1').hover(
    function(){$('#block2').stop().fadeIn()},
    function(){$('#block2').stop().fadeOut()}
);

Answer 2

1）如果用户快速鼠标悬停/出/出/出/等，即使用户的鼠标不在块1上，块2也会持续淡入/淡出/进/出/等等几秒钟。 / p>

您需要在mouseOut上取消动画。您可以使用stop方法执行此操作。 http://api.jquery.com/stop/

2）如果用户将鼠标移到块1上然后将鼠标移动到块2，则块2淡出 - 我需要块2保持可见。

向块2添加悬停事件，该块添加了一个css类，使块2始终可见。这应该在mouseout上删除。