jquery - 悬停功能工作时悬停

Question

如果我在同一个 div 上移动鼠标，当我的 div 向下或向上滑动时，悬停效果会发生第二次（甚至更多），如果该功能现在正在工作，我该怎么做它不应该重新启动，直到我采取鼠标移开并再次悬停？​</p>

<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。

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

加入.stop()

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