动画队列

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()

 })

你可能感兴趣的:(动画队列)