Div ID淡入淡出代码

我是jQuery的新手。 有人可以帮我解决我的2天问题。 我只需要一个淡入淡出效果的示例代码，幻灯片。

这是风格。

• 这将是同一级别的3个Div
• 第一个div将显示6secs然后淡出2secs
  • 在第一个淡出之前，第二个div会淡入2秒
  • 这将再次显示6secs然后淡出2secs。
• 然后第三个div将以相同的方式消退2秒。
• 显示6secs然后淡出2secs。 然后他们将旋转或循环。

谢谢你帮助我。

编辑 – 评论中的相关代码

$(document).ready(function(){ function looptour(){ $("#health").hide(); $("#billing").hide(); $("#pension").delay(6000).fadeOut(2000); $("#health").delay(6000).fadeIn(2000).delay(6000).fadeOut(2000); $("#billing").delay(14000).fadeIn(2000).delay(6000).fadeOut(2000); $("#pension").delay(14000).fadeIn(2000,looptour); } looptour(); }); 

Answer 1

我不确定你的确切问题是什么，因为你的代码似乎对我有用。

如果是我，我可能会做一点不同（假设我理解预期的结果）。

试一试： http ： //jsfiddle.net/XgFna/2/

 var arr = [ $("#pension"), $("#health").hide(), $("#billing").hide() ]; var cur = 0, nxt = 1; setInterval(function() { arr[cur].fadeOut(2000); arr[nxt].fadeIn(2000); cur = (cur + 1 < arr.length) ? cur + 1 : 0; nxt = (nxt + 1 < arr.length) ? nxt + 1 : 0; },6000); 

Answer 2

 $(document).ready(function() { function looptour() { $(".quote4").hide(); $(".quote3").hide(); $(".quote2").hide(); $(".quote1").delay(1000).fadeIn(3000).delay().fadeOut(1000); $(".quote2").delay(7000).fadeIn(3000).delay().fadeOut(1000); $(".quote3").delay(11000).fadeIn(3000).delay().fadeOut(1000); $(".quote4").delay(16000).fadeIn(6000).delay().fadeOut(1000, looptour); } looptour(); }); 

这就是我做到的，你只需要照顾延迟。