jQuery stop()的用法

说起来jQuery stop()的用法可能或觉得很简单。直到今天才知道原来我所理解的jQuery stop()有这么多用法！

下面一一来演示！不多说直接上干货

 

首先介绍一下这个动画分为五个过程

　　　　1.animater向右移动800px（这个完整的过程是动画1）

　　　　2.体逐渐变大（这个完整的过程是动画2）

　　　　3.透明度逐渐降低到0（这个完整的过程是动画3）

　　　　4.透明度逐渐恢复到1（这个完整的过程是动画4）

　　　　5.字体大小变为16px同时移动到距离左边界200px的位置（这个完整的过程是动画5）

 

 HTML

　　　　

　　　

css

　　

 

 jquery 

 

　　

　　　

 

　　　　总结讲述：点击button1，可以看到两个参数都是false,所以点击发生时，animate没有跳到当前动画（动画1）的最终效果，而直接进入动画2，然后3、4、5直至完成整个动画

　　　　　　　　点击button2，第二个参数是(true,false),所以整个动画停止！

　　　　　　　　点击button3，参数是（false,true),所以点击时，animate身处的当前动画停止且直接跳到当前动画的最终效果位置，接着正常执行下面的动画2,3，4,5直至完成整个动画！

　　　　　　　　点击button4，可以看到两个都是true ，所以点击按钮时，animate直接跳到动画1的最终效果位置，然后全部动画停止！

 

　　　　　　此文章用于解决动画积累问题！