动画队列

将动画连续的写就会形成一个动画队列，从上至下挨个执行

$('#btn').click(function(){
      $('.box').animate({
        left: '300px'
      }, 2000)//执行第一帧动画向左移动到300px
      $('.box').animate({
        left: '100px',
        top: '100px'
      }, 2000)//执行第二帧动画操作移动到上面这个位置。
      $('.box').animate({
        left: '0',
        top: '100px'
      }, 1000)//执行第三帧
      $('.box').animate({
        left: '0',
        top: '0'
      }, 1000)//执行第四帧
    })

第二种写法是将后续动画写入第一个动画的回调函数里

.clearQueue

清楚动画队列中未执行的动画

.finish

停止动画，清楚动画队列中未完成的动画，展示为最终帧动画的最终状态

.stop

1:如果没加参数即.stop() ===stop(false,false)会停止当前队列中正执行动画，但是默认不清除动画队列，会继续执行后续的队列中的动画
2:如果清楚队列即.stop(true,false)会停止不动
3：如果两个参数都设置为true即在清除队列的同时展现最终状态即.stop(true,true)
会停止在当前正执行这一帧动画的最终态
https://link.jianshu.com/?t=http%3A%2F%2Fjs.jirengu.com%2Flafovikani%2F1%2Fedit