Question

目前我有一个JQuery脚本http://jsfiddle.net/gaby/zzj7E/5/，它处理了当我将鼠标悬停在特定div上时，隐藏的div向下滑动的要求。这种情况发生在我悬停的每个div上。

但是你会注意到，如果将鼠标快速悬停在div组上，它会立即让几个div向下滑动。其实我不想要这个。

我想要的是，除非前一个div没有完全滑落，否则另一个div即使徘徊也不会向下滑动。或者，如果可能，只有当用户将鼠标悬停在1.5秒以上时才显示div滑动效果。

这可以在jQuery中实现吗？有人可以帮忙吗？

修改不得不使用.live（）将效果添加到动态添加的元素中。 COuld使用live（）进行悬停，因为它证明很麻烦。以下是使用

的代码

 $(".altbgcolor").live('mouseenter', function() {
              //hover code
              $(this)
                    .addClass('altbgcolor-active')
                    .find(".sharedp")
                    .slideDown('slow');
            }).live('mouseleave', function() {
              //stopped hovering code
              $(this)
                    .removeClass('altbgcolor-active')
                    .find(".sharedp")
                    .slideUp('slow');
            });

如何在此mouseenter和mouseleave事件中集成效果？

Answer 1

这样的事情会起作用：

http://jsfiddle.net/zzj7E/27/

$(".altbgcolor").hover(function() {
    var el= $(this);
    el.addClass('altbgcolor-active');
    el.data('hover', setTimeout(function()
        {
            if (el.hasClass('altbgcolor-active'))
            {
                el.find(".sharedp").slideDown('normal');
            }
        }, 1500)
    );

},function () {
    var el= $(this);
    clearTimeout(el.data('hover'));
    el.removeClass('altbgcolor-active')
        .find(".sharedp")
        .slideUp('normal');
});

编辑：如果使用mouseover和mouseout事件而不是悬停：

http://jsfiddle.net/zzj7E/30/

$(".altbgcolor").live({
    mouseenter: function() {
        var el= $(this);
        el.addClass('altbgcolor-active');
        el.data('hover', setTimeout(function()
            {
                if (el.hasClass('altbgcolor-active'))
                {
                    el.find(".sharedp").slideDown('normal');
                }
            }, 1500)
        );      
    },
    mouseleave: function () {
        var el= $(this);
        clearTimeout(el.data('hover'));
        el.removeClass('altbgcolor-active')
            .find(".sharedp")
            .slideUp('normal');
    }
});

Answer 2

我不是100％确定你想要什么，但我认为你正在寻找.stop()

有你更新的例子： http://jsfiddle.net/zzj7E/18/

JQuery Slideup / Slidedown只在前一个div动画之后或者在延迟之后

2 个答案: