如果鼠标停留超过2秒然后显示其他没有？

Question

这是我在悬停时应用于div的jQuery滑动功能,以便向下滑动按钮.

它工作正常,但现在每当有人进出它时,它就会不停地上下跳动.

我想如果我把一个或两个延迟计时器放在它上面会更有意义.

只有当用户在div上停留超过一两秒时,我才能修改运行向下滑动的功能？

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js "></script>
<script type="text/javascript">

$("#NewsStrip").hover(
function () {
    $("#SeeAllEvents").slideDown('slow');    },
function () {
    $("#SeeAllEvents").slideUp('slow');
});

</script>

Answer 1

您需要在鼠标悬停时设置计时器并在激活幻灯片时或在鼠标移动时清除它,以先发生者为准:

var timeoutId;
$("#NewsStrip").hover(function() {
    if (!timeoutId) {
        timeoutId = window.setTimeout(function() {
            timeoutId = null; // EDIT: added this line
            $("#SeeAllEvents").slideDown('slow');
       }, 2000);
    }
},
function () {
    if (timeoutId) {
        window.clearTimeout(timeoutId);
        timeoutId = null;
    }
    else {
       $("#SeeAllEvents").slideUp('slow');
    }
});

看到它在行动.