0

这是我的 HTML 代码：

<div class="img-meta">
        <div class="img-meta-link meta-icon"><a class='meta-link' href="#"><i class="icon-link"></i></a></div>
        <div class="img-meta-img meta-icon"><a class='meta-link' href="#"><i class="icon-picture"></i></a></div>
</div>

这是jQuery

jQuery(".featured-thumb").hover(function() {
        jQuery('.img-meta').slideDown(600,'easeOutBounce', function() { 
            jQuery('.img-meta-link').css('margin-right','50px');
            jQuery('.img-meta-link').animate({'margin-right':'0px'},500);
        });
    },
        function() {
        jQuery('.img-meta-link').animate({'margin-right':'50px'},500);
        //jQuery('.img-meta-link').css('margin-right','50px');
        jQuery('.img-meta').fadeOut('fast');
        jQuery('.img-meta-link').stop(true,false);  
    });

我想要做的是，向下滑动img-meta，并在meta-icon向下滑动后淡入。

我能够完美地做到这一点。但是，当我将鼠标快速移入和移出容器时，我看不到任何向下滑动的效果。只是，meta-icon一次又一次的淡入淡出，没有。我将鼠标移到容器上的次数。

我.stop()最终实施了，以避免它。但是，这不会发生。任何人都可以解释这个吗？

4

1 回答 1

0

您可能想要使用 jQuery .hoverIntent() 插件。HoverIntent 对悬停事件稍作延迟，以便它仅在用户有意将鼠标悬停在目标上时触发，而不是在将鼠标移动到页面上的其他位置时无意中将鼠标悬停在目标上一瞬间。

于 2013-10-15T23:57:38.487 回答