jQuery动画不会单独运行

Question

我有以下内容：

<div id="content">
    <div class="update">1.</div>
    <div class="update">2.</div>
    <div class="update">3.</div>
    <div class="update">4.</div>
</div>

我希望使用div div中的update类为每个content制作动画。我像这样给他们制作动画：

$('#content div.update').each(function(){
    $(this).animate({
        'margin-top': '10px',
        'opacity': 1
    }, 300);
});

我发现动画一下子就完成了。我查了queue函数，但它根本没有给我任何意义。我发现了一些博客文章，但它们让它变得复杂。有人可以给我一个例子，说明我应该如何正确排队，以便逐个动画每个div.update吗？

Answer 1

尝试：

See jsFiddle

$('#content div.update').each(function(i){
    $(this).delay(i*300).animate({
        'margin-top': '10px',
        'opacity': 1
    }, 300);
});