jquery - 我怎样才能先 fadeIn() 然后 fadeOut() 然后 insertAfter()？

Question

我制作了简单的 div 淡入淡出循环。有些 div 在一个外部 div 中，而在另一个外部 div 中。我编写了一个脚本，通过淡入和淡出来循环这些 div。但是有一个问题，div 淡出但淡入。

查看此 fiddle看看那个丑陋的效果。

JS:

function tick() {
    var $obj = $(".major_data .commitment_box .commitment");
    $obj.first().fadeIn().delay(1000).fadeOut(function () {
        $obj.first().insertAfter($obj.last());
        tick();
    });
}
tick();

当循环重复时，效果就正确了。如何在循环的第二个循环中实现效果？

Answer 1

"But there's a problem, the divs are faden out but are faden in."

我假设您一开始是想说“div 没有淡出”。如果您说您希望所有 div 开始时都是隐藏的，这样即使第一个 div 也会淡入，只需更改以下行:

var $obj = $(".major_data .commitment_box .commitment");

...为此:

var $obj = $(".major_data .commitment_box .commitment").hide();