Javascript 如何设置5秒钟的动画，然后淡出（）jquery

我想做的是淡入一个元素，然后通过上下淡入不透明度使元素看起来发光，我想这样做大约5秒钟，然后一旦完成，我想淡出元素

我一辈子都搞不懂该怎么做。这是我目前的代码：

function showContent() { $('.item').fadeIn(3000);
$('.item').animate({opacity:'+=1'}, 1000);
$('.item').animate({opacity:'-=0.4'}, 1000);
};

现在它只是不断闪烁，我想在5秒钟后停止，然后淡出

---

任何帮助都会很棒

您需要初始化完成第一个动画的第二个动画，第三个动画也是如此

因此，使用完整回调来初始化下一个动画

function showContent() { 
    $('.item').fadeIn(3000, function(){
        console.log('2')
        $(this).animate({opacity:'+=1'}, 1000, function(){
            console.log('3')
            $(this).animate({opacity:'-=0.4'}, 1000);
        });
    });
};

---

演示：

您需要初始化完成第一个动画的第二个动画，第三个动画也是如此

因此，使用完整回调来初始化下一个动画

function showContent() { 
    $('.item').fadeIn(3000, function(){
        console.log('2')
        $(this).animate({opacity:'+=1'}, 1000, function(){
            console.log('3')
            $(this).animate({opacity:'-=0.4'}, 1000);
        });
    });
};

---

演示：

不要担心回调，可以使用jQuery动画队列

$('.item')
   .fadeIn(3000)
   .delay(100)
   .fadeTo(1000, 0.4)
   .delay(100)
   .fadeTo(1000,1)
   .delay(100)
   .fadeOut(3000);

---

演示：

不要担心回调，可以使用jQuery动画队列

$('.item')
   .fadeIn(3000)
   .delay(100)
   .fadeTo(1000, 0.4)
   .delay(100)
   .fadeTo(1000,1)
   .delay(100)
   .fadeOut(3000);

---

演示：

我为您制作了一个在线代码演示

通常，在设置动画之前为div设置sane css（例如，不透明度：1.0） 然后淡入淡出，使用不透明度（我不知道+==我只使用数字，比如1.0表示100%，0.40表示40%…等等）

当然，与所有jquery一样，您可以链接调用

$(document).ready(function(){
    $('#box').fadeIn(3000).animate({opacity:1.0}, 1000).animate({opacity:0.5}, 1000).fadeOut(3000);
});

---

我已经为您制作了一个在线代码演示

通常，在设置动画之前为div设置sane css（例如，不透明度：1.0） 然后淡入淡出，使用不透明度（我不知道+==我只使用数字，比如1.0表示100%，0.40表示40%…等等）

当然，与所有jquery一样，您可以链接调用

$(document).ready(function(){
    $('#box').fadeIn(3000).animate({opacity:1.0}, 1000).animate({opacity:0.5}, 1000).fadeOut(3000);
});

---

和都可以指定一个函数，以便在操作完成时执行。您需要将每个后续函数放在前一个函数的完整函数中。这两个函数都可以在操作完成时指定一个要执行的函数。您需要将每个后续函数放在前一个函数的完整函数中。可读性也是一个大优点。可读性也是一个大优点。