我有3张图片会旋转，但他们不会回到第一张图片并从头开始

Question

我有3张图片需要旋转并从第一张图片开始。 这里是我的jQuery，HTML和CSS。我相信问题出在我的jQuery代码上。

#hero { 
    width: 960px; 
    height: 300px; 
} 
#hero div { 
    top: 324px; 
    left: 400px; 
    position: absolute; 
    z-index: 0; 
} 
#hero div.previous { 
    z-index: 1; 
} 
#hero div.current { 
    z-index: 2; 
} 

<div class= "container"> 
    <div id="hero"> 
     <div class="current"><img src="prayer2.jpg"></div> 
     <div><img src="prayer3.jpg" ></div> 
     <div><img src="Prayer1.jpg"></div> 
    </div> 

$(function() { 
    setInterval("rotateImages()",3000); 
}); 

function rotateImages() { 
    var c1 = $('#hero div.current'); 
    var n1 = c1.next(); 

    if (n1.length == 0) 
     n1 = $('#hero div: first'); 

    c1.removeClass('current').addClass('previous'); 
    n1.css({ opacity: 0.0 }).addClass('current') 
     .animate({ opacity: 1.0 }, 1000, function() { 
      c1.removeClass('previous'); 
     }); 
} 

Answer 1

有许多问题与代码，

1. $('#hero div: first'); - 无法识别的表达。它应该是$('#hero div:first'); - 注意空间。
2. 将setInterval调用更改为setInterval(rotateImages,3000);。原因是"rotateImages()"在全球范围内运行。 Refer