jquery animate stop函数解析

今天咱们来看看jquery中动画操做的stop函数。其实我至今不是很明白啊,因此此文算是求救以及抛砖引玉。css

在jquery 1.7版本之前,stop支持两个参数,分别是clearQueue和jumpToEnd。这点能够参考官方文档:stopjquery

今天我写个示例,该例参考了w3school的在线测试代码:jquery stop 参数示例api

本人代码示例demo1demo2函数

stop(clearQueue,jumpToEnd)函数分析

仅仅从官方API上给出的说明,咱们就知道,第一个参数是针对的其它动画队列(不包含当前动画),第二个参数则是当前动画。测试

那么,什么是动画队列呢?动画

所谓的动画队列就是一系列要执行的动画,好比对一个盒子先在前一秒执行挪动动画,再过一秒执行变大的动画。那么,这就是两个动画了。.net

再好比,点击某个按钮a,给盒子b触发动画效果,每次挪动10px,挪动10px须要的时间是2s,那么以很快的速度狂点这个a按钮,你在2s时间里点了10次,这个动画须要累积10次的。虽然咱们2s里只能完成1个动画效果,可是剩下的9个动画仍是要完成的,这就造成了动画累积,跟排队似的,若不作任何处理,将会逐个按照先来先动画的规则完成。xml

但现实中,这种动画累积并不是是咱们指望的结果。因此,咱们须要对动画进行更多的操做。从stop的参数来看,对于动画的操做,分为当前动画等候动画队列,传入的参数为boolean值类型。队列

  • clearQueue,是否清除等候动画队列,默认false,便是不清除等候动画队列,设置为false,则清空等候动画队列。
  • jumpToEnd,是否当即完成当前动画,默认false,便是中止当前动画,设置为true,则当即完成当前动画。

没错,上面的例子确实能够验证stop函数的参数做用。文档

可是,尼玛啊,我又写了个例子,我感脚个人认知又被颠覆了。。。

在线demo,请猛戳 jquery stop 示例3

记住,测试时,光标迅速进入和离开。而后,光标再次进入时,就没反应了。。

另外,既然第一个设置是针对等候动画队列的,为什么我设置为false时,那些积累的动画队列就不执行了呢?

仍是执行了,可是很短暂?

求大神告知我真相。

相关文章
相关标签/搜索