串行动画

jQuery的动画效果还可以串行执行，通过 delay() 方法还可以实现暂停，这样，我们可以实现更复杂的动画效果，而代码却相当简单：

var div = $('#test-animates');

// 动画效果：slideDown - 暂停 - 放大 - 暂停 - 缩小

div.slideDown(2000)

.delay(1000)

.animate({

width: '256px',

height: '256px'

}, 2000)

.delay(1000)

.animate({

width: '128px',

height: '128px'

}, 2000);

}

</script>

因为动画需要执行一段时间，所以jQuery必须不断返回新的Promise对象才能后续执行操作。简单地把动画封装在函数中是不够的。