jquery - jquery 3步动画队列计时

Question

我想要一个动画，其中元素在向右移动（5000 毫秒）时淡入（1000 毫秒），最后它应该在元素仍在向右移动时再次淡出（在 4000 毫秒，持续时间 1000 毫秒）。

我得到了前两个部分的工作，但碰巧需要最后一部分的时间设置帮助（不透明度：0）。

这是我的代码：

$(document).ready(function(){
    var truck = $('.truck');
    truck.css("opacity", "0");
    truck.animate({
        opacity: 1
    }, {
        queue: false,
        duration: 1000
    }).animate({
        right: 15
    }, 5000).animate({
        opacity: 0
    }, 1000);

});

谢谢你。

Answer 1

尝试这个...

var truck = $('.truck');
truck.css("opacity", "0");
truck
    .animate({
        right: 15
    }, {
        queue: false,
        duration: 5000
    })
    .animate({
        opacity: 1
    }, 1000)
    .delay(3000)
    .animate({
        opacity: 0
    }, 1000);

这是一个有效的jsfiddle ...

http://jsfiddle.net/YTt9W/