调用.animate 2次相同的元素

Question

$(document).ready(function(){
  $("button").click(function(){
    $("div").animate({'marginLeft': "+=100px",
    'height': "100px",
    'width': "100px",
  }, 3000).animate({'backgrounColor': "blue"},5000);
  })
})

您好，我正在研究jquery动画，其中div元素将其更改s size and position (this part lasts 3 seconds) and after it已完成，将其背景色更改为蓝色（5秒）。第一部分工作正常，但我不知道如何在颜色更改开始之前处理设置中断或两次调用.animate

Answer 1

$('#div').animate({'marginLeft': "+=100px",
                       'height': "100px",
                       'width': "100px"}, 3000, function() {
                                                 $('#div').fadeIn('slow', function() {
                                                   $("#div").animate({'backgrounColor': "blue"},5000)
            });
        });