jQuery 动画停止/恢复技术或模式

Question

我看过其他一些半相关的帖子，但没有什么能真正 100% 回答我的问题。

无论如何，我想做的是 pause+fadeIn onHover，pause+fadeOut onHoverOut，这样动画不会完成，除非用户保持悬停或悬停。如果用户做了一堆快速悬停和悬停，我不希望它排队一堆连续的动画。我已经使用 stop() 和 clearQueue() 接近了，但是有问题。

如果我再次快速悬停、悬停和悬停，动画会暂停但不会过渡到下一个动画。事实上，足够的 hover 和 hoverOuts 会导致动画在我的计算机上完全停止。

查看下面的示例页面和附加的脚本。也许这个特定问题有一个共同的模式或方法？我在网上看到很多类似的事情，有时是渐变动画，有时是运动动画等。

在示例中，我有意使用较慢的动画时间，以便您有足够的时间来回悬停。

演示： http://ficreates.com/_SiteDemos/lwv2/

脚本： http://ficreates.com/_SiteDemos/lwv2/scripts/carNav.js

无论如何，提前感谢您能给我的任何帮助:) 我当然需要它！

Answer 1

这是你要找的吗？

    function carNav() {
        var $navBox = $("#nav_buttons li");

        $navBox.hover(
            function() {
                var $navCar = $(this).find(".nav_car");
                $navCar.fadeIn(2000);
            },
            function() {
                var $navCar = $(this).find(".nav_car");                 
                $navCar.stop().fadeOut(2000);
            }
        );
    }

    $(document).ready(carNav);

演示 http://jsfiddle.net/m2pF5/

或者您可以完全使用 css 来完成，（需要 ie 的后备）

CSS DEMO http://jsfiddle.net/eNJ6x/1/