jQuery 效果和队列答案

【问题标题】：jQuery Effects and QueuesjQuery 效果和队列
【发布时间】：2012-08-24 13:38:12
【问题描述】：

我正在尝试使用 jQuery 效果链来操作对象。链中的一些效果取决于对象的当前位置。但似乎整个效果链在执行之前都已排队，因此任何获取当前定位的函数调用都会返回不正确的值。

我正在使用的标准链接的两个替代方案 (.fadein().fadeOut().animate()) 是在每个效果完成后使用回调来开始下一个效果。或者我可以看看使用 jQuery 队列。

我是否正确假设如果我对回调进行编码，例如 .fadeIn(500,startNextEffect)，当 fadeIn 效果排队时将不会评估 startNextEffect 的内容？我还缺少什么更简单的东西吗？

谢谢你，克里斯

【问题讨论】：

startNextEffect 函数将在动画结束时被调用，所以是的，直到那时它的内容才会被评估（除了来自外部范围的预缓存变量，它将具有最后一个值集，当然）。

标签： jquery effects queueing

【解决方案1】：

您可以使用 css position 属性重叠图像，而不是使用 fadeIn() 和 fadeOut() 效果：

Here is jsFiddle example.

jQuery：

$(document).ready(function() {
    $('img').click(function() {
        $('img').fadeOut(400);
        $(this).next().delay(100).fadeIn(600);
    });
});

css：

img { position:absolute; left:10px; top:10px; }

【讨论】：