jQuery中的动画队列
2019-10-03 本文已影响0人
PingerL
1.什么是队列?
队列是一种特殊的线性表,遵循先进先出,后进后出原则。
2.jQuery中的动画队列
- 动画队列可以说是动画执行的一个顺序机制,当我们对一个对象添加多次动画效果时后,添加的动作就会被依次放入这个动画队列中,等前面的动画完成后,后面的动画再开始执行。
3.代码示例
动画执行顺序:hide()、show()、fadeOut()、fadeIn()、slideUp()、slideDown()
$box.hide(1000).show(1000).fadeOut().fadeIn().slideUp().slideDown(function(){
console.log('执行完毕')
})
4.其他
一般来说,动画执行的顺序都将按照动画队列的方式来进行,但是有时候也不一定,比如说如果队列中存在appendTo
函数,则appendTo
函数是不会进入这个队列中,并且先于动画函数的执行,也就是在动画队列,先进先出,取出第一个函数之前,它就已经执行了
下列动画执行顺序:appendTo()、hide()、show()
$('.box').hide('slow').appendTo($('.test')).show('slow');
P.S
现在大部分动画都用CSS3去实现,除非特别复杂的才会用到JS去实现。