悬停功能悬停时悬停

Question

如果我在同一个div上移动鼠标，我的div会向下或向上滑动，而悬停效果会再次发生（或者甚至更多），如果该功能现在正在工作，我该怎么做才能重新启动直到我把鼠标移开并再次盘旋？     

<div id="hover">Hover on me<div id="hidden">You hovered!!</div></div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

$(document).ready(function () {
$('#hover').show();
$('#hidden').hide();    
$('#hover').hover(function () {
    $('#hidden').slideDown(100);
    }, function () {
        $('#hidden').slideUp(100);
    });
});​

Answer 1

您应该使用jQuery .stop() （API）请参阅jsfiddle here。

您想要做的是稍微改变您的悬停功能。

加入.stop()

$('#hover').hover(
    function () {
        $('#hidden').slideDown(100);
    }, function () {
        $('#hidden').stop().slideUp(100);
    }
);