Question

这是我的代码：

$('#gallery-listA li.thumbnail').click(function() {
            $(this).addClass('chosen');
            $('')
            $('#gallery-listA li.thumbnail').not(this).addClass('notchosenA');
            $('#gallery-listB li.thumbnail').addClass('notchosenB');
            $('.notchosenB').fadeTo(500,0.0)
            $('.notchosenB').hide(300);
            });

fadeTo和hide动画并行运行而不是连续运行。我可以将动画加载为回调或手动将它们放入队列，但是jQuery不应该自动排队动画吗？有谁看到我的错误是什么？

Answer 1

如果你想在fadeTo动画完成时做某事，那就把它放在fadeTo动画的完成函数上。

$('.notchosenB').fadeTo(500,0.0, function() {
    $(this).hide();
});

此外，当对象已经处于零不透明度时，我认为发送.hide(300)的持续时间没有任何意义，所以我删除了该持续时间。

由于你的0不透明度渐渐消失，所以最好只使用.fadeOut()，它会淡化为零不透明度，然后自动隐藏最后的项目，这样你就不需要.hide() < / p>

$('.notchosenB').fadeOut(500);

此处的演示演示：http://jsfiddle.net/jfriend00/ZrPL2/。

jQuery将对连续的动画进行排队，但.hide()显然不被视为动画，因此它不会进入队列（我在jsFiddle中验证过）。您可以看到这会将它们排队以按顺序运行：

$("#test").fadeOut(400).fadeIn(1000).fadeOut(400).fadeIn(1000);

请在此处查看：http://jsfiddle.net/jfriend00/wBbnK/

问题排队动画

1 个答案: