jQuery动画高级用法——详解animation中的.queue()函数

时间:2022-09-11 01:31:38

http://www.cnblogs.com/zhwl/p/4328279.html

$('#object').hide('slow').queue(function(next){

    $(this).appendTo($('#goal'));
    next();
}).show('slow');
 
$('div').slideUp('slow').slideDown('slow',function(){
    $('#object').css({"background":"red"});
});
 
$("#object")
.delay(1000, "fader")
.queue("fader", function(next) {
    $(this).animate({opacity: 0},
        {duration: 1000, queue: false});
    next();
})
.dequeue("fader")
.animate({top: "-=40"}, {duration: 2000})

我们先来看它的思路:把控制不透明度和控向上移动的动画分别存储在两个队列中,控制向上移动的队列按默认情况进行(在2000毫秒内完成),而不透明度的控制在1000毫秒内执行,但这个队列要晚于默认队列1000毫秒执行

再简单一点,就是:前1000毫秒,只有控制高度的“fx”队列执行,而后1000毫秒,控制不透明度的“fader”队列和控制高度的“fx”并行