jQuery 循环淡入淡出两个图像!

Question

我无法弄清楚如何让简单的淡入淡出循环发挥作用。正如你所见，我对 jQuery 还很陌生。我已经尝试过，但现在需要很长时间才能解决，所以我想我应该寻求一些帮助。

我想做的事:

我有两个图像，id 为#img1 和#img2。我希望图像 1 淡入，然后等待 6 秒，然后淡出。我已经尝试过 .wait 函数，但它只是停止了我的工作。我设法让第一张图像淡入然后淡出，但中间没有等待。然后，我想在图像 1 淡出时开始淡入图像 2，然后让图像 2 等待，然后淡出，同时图像 1 再次淡入并永远循环!希望这是有道理的。

 $(document).ready(function(){
  $('#img1').hide()
.load(function () {
  $(this).fadeIn(4500)
  .fadeOut(4500);
  $('#img2').hide().wait(9000)
  .load(function () {
  $(this).fadeIn(4500)
  .fadeOut(4500);
});

干杯，这让我发疯。 PS你能试着对你的答案中发生的事情做一些解释吗？谢谢

Answer 1

这是一个四图像循环幻灯片，它不使用 setTimeout 函数，而是使用延迟函数。

<script>
  function startSlideshow(){
    $("div.text_b1").fadeIn(1000).delay(10500).fadeOut(1500); //13000
    $("div.text_b2").delay(13000).fadeIn(1500).delay(11000).fadeOut(1500); //27000
    $("div.text_b3").delay(27000).fadeIn(1500).delay(11000).fadeOut(1500); //41000
    $("div.text_b4").delay(41000).fadeIn(1500).delay(11000).fadeOut(1500, startSlideshow); //55000
  }

  $(document).ready(function(){
    startSlideshow();
  });
</script>

查看实际效果 http://www.erestaurantwebsites.com/