jQuery幻灯片显示不同的延迟时间

我使用了Innerfade和Cycle，但我有几个div需要淡入，暂停和淡出，但我想以不同的速率暂停不同的幻灯片，因为有些内容会比其他幻灯片更多。 我没有看到我如何通过Innerfade或Cycle实现这一目标。

我尝试过这个，但所有事件都会立即触发。

 
Content1
 
Content2
 
Content3
 
Content4
 
Content5
 
  $("#slide1").fadeIn('slow'); $("#slide1").delay(5000).fadeOut('slow'); $("#slide2").fadeIn('slow'); $("#slide2").delay(5000).fadeOut('slow'); $("#slide3").fadeIn('slow'); $("#slide3").delay(10000).fadeOut('slow'); $("#slide4").fadeIn('slow'); $("#slide4").delay(5000).fadeOut('slow'); $("#slide5").fadeIn('slow'); $("#slide5").delay(5000).fadeOut('slow');  

所以在这种情况下，我希望在5秒后淡出每张幻灯片，但幻灯片3应该保持10秒钟。 我怎么能做到这一点？ 谢谢你提供的所有帮助！

Answer 1

“延迟”仅延迟与其关联的元素的动画，而不是您稍后动画的其他元素。 使用“setTimeout”javascript函数代替查看代码：

http://jsfiddle.net/elusien/eyJC4/

代码是：

 $("#slide1").fadeIn('slow').delay(5000).fadeOut('slow'); var t2 = setTimeout(function(){ $("#slide2").fadeIn('slow').delay(5000).fadeOut('slow'); var t3 = setTimeout(function(){ $("#slide3").fadeIn('slow').delay(10000).fadeOut('slow'); var t4 = setTimeout(function(){ $("#slide4").fadeIn('slow').delay(5000).fadeOut('slow'); var t5 = setTimeout(function(){ $("#slide5").fadeIn('slow'); }, 6500); }, 11500); }, 6500); }, 6500); 

用于触发超时function的值是先前的“延迟”值加1500（1.5秒）。

问候尼尔