动画队列

2019-01-28  本文已影响0人  猢狲宙斯

jquery中的animate的自定义动画中,含有动画队列的感念。将所要执行的动画按一个个的排列成一队,并先后顺序的一个个的执行。这篇文章用于讲述动画队列的大致指令及功能。

.animate

虽然只是使用.animate( properties [, duration ] [, easing ] [, complete ] )这个指令就能完成动画队列,但是其中就能衍生出无数的可能性,主要还是要靠使用者的创造力来展现不一样的动画队列。

clearQueue

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


.finish

停止当前动画,并清除动画队列中所有未完成的动画,最终展示动画队列最后一帧的最终状态


.stop( [clearQueue ] [, jumpToEnd ] )

停止当前正在运行的动画

clearQueue(default: false)

jumpToEnd(default: false)

范例:

$('#btn6').click(function(){

    //停止当前动画$('.box').stop()

 })

 $('#btn7').click(function(){

//停止当前动画,并清除未执行的动画队列

$('.box').stop(true,false) 

 })

 $('#btn8').click(function(){

//停止当前动画,并清除未执行的动画队列,并且当前动画展示最终状态

$('.box').stop(true,true)

 }) 

 $('#btn9').click(function(){

//停止当前动画,并清除未执行的动画队列,并且当前动画展示最终状态

$('.box').finish()

 })

上一篇 下一篇

猜你喜欢

热点阅读