鼠标悬停时出现棘手的延迟

这就是我目前所拥有的：

$("#cart-summary").mouseenter(function () {
    $('.flycart').delay(500).slideDown('fast');
});
$(".flycart").mouseleave(function () {
    $('.flycart').delay(500).slideUp('fast');
}).find('a.close').click(function(){
   $(this).parents('.flycart').hide();
});

它的作用是：

如果鼠标悬停在 #cart-summary -> 500 毫秒后打开 Flycart

if mouseout .flycart -> 500ms后关闭flycart

我需要的是：

如果鼠标悬停在 #cart-summary 上至少 500 毫秒 -> 打开 Flycart

如果 mouseout .flycart 至少 500 毫秒 -> 关闭 Flycart

编辑添加：我也用hoverIntent，这里可以用吗？

非常感谢！

使用 setTimeout 检查您设置/取消设置的标志（我正在使用一个类）是否仍然有效。

$("#cart-summary").mouseenter(function () {
    $("#cart-summary").addClass("hasFocus");
    setTimeout(function(){ 
        if ($("#cart-summary").hasClass("hasFocus")) {
            $('.flycart').slideDown('fast');
        }
      }, 500 );
      });

$("#cart-summary").mouseleave(function () {
    $("#cart-summary").removeClass("hasFocus");
});


$(".flycart").mouseenter(function () {
    $("#cart-summary").removeClass("lostFocus");    
});

$(".flycart").mouseleave(function () {
    $("#cart-summary").addClass("lostFocus");
    setTimeout(function(){ 
        if ($("#cart-summary").hasClass("hasFocus")) { 
            $('.flycart').slideUp('fast');
            }).find('a.close').click(function(){
            $(this).parents('.flycart').hide();
        }
    }, 500)
});