Question

我有一个下拉菜单，当鼠标移动到特定链接时会触发该菜单。如果鼠标在特定时间段内远离下拉列表，我希望该下拉菜单淡出？

有可能吗？

这是我打开下拉菜单的jQuery：

$('.cartpopup').css({'display':'none'});
$('.cart-link').bind('mouseenter',function(){
    $('.cartpopup').stop(true, true).show().animate({top: 100}, 200).animate({top: 44}, 500);
});

现在，如果弹出窗口处于非活动状态，如何自动关闭弹出窗口，例如鼠标没有超过它一段时间。

Answer 1

如果使用setTimeout()设置计时器，则会返回一个值，稍后您可以使用该值取消该超时。

例如，如果你有：

var hideTimer = null;
$('.cartpopup').bind('mouseleave', function() {
    hideTimer = setTimeout(function() {
        // Code to hide menu goes here
    }, 1000);
});

然后当鼠标再次进入该项目时，您可以取消定时器，如下所示：

$('.cartpopup').bind('mouseenter', function() {
    if (hideTimer !== null) {
        clearTimeout(hideTimer);
    }
});

这样，如果鼠标在计时器执行之前重新进入该项目，那么它将保持可见状态。

如果鼠标未在其上一段时间，则隐藏元素

1 个答案: