Javascript 显示两个“li”而不是一个“li”的基本li旋转器

我有一个简单的图像滑块，通过ul旋转，一个接一个地显示每个li。最近，它开始显示两幅图像，而不是一幅。它以5个lis的模式显示图像：无&1、1&2、2&3、3&4、4&5，然后是1&5、1&2、2&3，依此类推。我的网站页脚中有一个例子：

我的代码是：

function fadingSlider(currentListItem, startListItem, fadeInDuration, displayDuration, fadeOutDuration) {
  if(!currentListItem) {
    startListItem.fadeIn(fadeInDuration).delay(displayDuration).fadeOut(fadeOutDuration, function() {
            fadingSlider(startListItem, startListItem, fadeInDuration, displayDuration, fadeOutDuration);
        }); //#webmaster fade in, fade out, then recurse with start
    return;
  }
  else {
    currentListItem = currentListItem.next("li");
    if ((currentListItem.get(0)) === (currentListItem.parent().last("li").get(0))) {
      startListItem.fadeIn(fadeInDuration).delay(displayDuration).fadeOut(fadeOutDuration, function() {
          fadingSlider(startListItem, startListItem, fadeInDuration, displayDuration, fadeOutDuration);
    });
    return;
    }
    else {
        currentListItem.fadeIn(fadeInDuration).delay(displayDuration).fadeOut(fadeOutDuration, function() {
        fadingSlider(currentListItem, startListItem, fadeInDuration, displayDuration, fadeOutDuration);
        });
        return;
    }
  }
}

jQuery(window).load(function() {
  fadingSlider(null, jQuery("ul.sponsorSlider > li:first-child"), 300, 5000, 300);
});

编辑：我试图重写脚本，使其更简单，并可能消除错误，但不幸的是，错误仍在发生。以下是新版本：

function fadingSlider(currentListItem, list, fadeInDuration, displayDuration, fadeOutDuration) {
    if(currentListItem){
        currentListItem = currentListItem.next("li");
    }
    if(!currentListItem || currentListItem.length === 0) {
    currentListItem=list.children("li:first-child");
    }
    currentListItem.fadeIn(fadeInDuration).delay(displayDuration).fadeOut(fadeOutDuration, function() {
        fadingSlider(currentListItem, list, fadeInDuration, displayDuration, fadeOutDuration);
    });
    return;
}

jQuery(window).load(function() {
  fadingSlider(null, jQuery("ul.sponsorSlider"), 300, 5000, 300);
});

html是这样的：

<section class="sponsors">
<h1>Sponsors</h1>
   <ul class="sponsorSlider">
      <li><a href=""><img src="/Standard/Images/SponsorLogos/aftonChemicalLogo.jpg" alt="" /></a></li>
      <li><a href=""><img src="/Standard/Images/SponsorLogos/dupontLogo.jpg" alt="" /></a></li>
      <li><a href=""><img src="/Standard/Images/SponsorLogos/flexicellLogo.jpg" alt="" /></a></li>
      <li><a href=""><img src="/Standard/Images/SponsorLogos/cFSauerLogo.jpg" alt="" /></a></li>
      <li><a href=""><img src="/Standard/Images/SponsorLogos/mWVLogo.jpg" alt="" /></a></li>
   </ul>
</section>

---

编辑：奇怪的是，我将问题追溯到jQuerywindow.load的使用。出于某种原因，该事件发生了两次。我把它改成了window.onload，这东西就像一个符咒。我认为这是jQuery的一个bug，但它看起来很奇怪。

我在您的脚本“赞助商.js:”中看到了这一点

startListItem.fadeIn(fadeInDuration).delay(displayDuration).fadeOut(fadeOutDuration, function() {
        fadingSlider(startListItem, startListItem, fadeInDuration, displayDuration, fadeOutDuration);

…在第二行中，您将两次传递StartIsItem，作为下一次迭代的currentListItem和StartIsItem。这在代码中发生两次

请尝试以下方法：

startListItem.fadeIn(fadeInDuration).delay(displayDuration).fadeOut(fadeOutDuration, function() {
        fadingSlider(startListItem, startListItem.next(), fadeInDuration, displayDuration, fadeOutDuration);

---

尝试将currentListItem添加到第一个参数中，如：

...
    currentListItem = currentListItem.next("li"); 
    if ((currentListItem.get(0)) === (currentListItem.parent().last("li").get(0))) { 
      startListItem.fadeIn(fadeInDuration).delay(displayDuration).fadeOut(fadeOutDuration, function() { 
          fadingSlider(currentListItem, startListItem, fadeInDuration, displayDuration, fadeOutDuration); 
... 

编辑：

您可能需要将旧的currentListItem设置为以下列表项：

startListItem = currentListItem;
currentListItem = currentListItem.next("li");

此外：

---

为什么将href=作为img的属性

看看我在这里用的东西：

---

这可能不是最好的方法，但效果很好，可能是一个很好的起点！：D

问题在于jQuerywindow.load。由于某些原因，此事件已触发两次。改用window.onload解决了这个问题。

哦，哎呀。我想我只是昏过去了。图像周围应该有一个a标签。我会解决的。我为什么要改变它？我使用它来跟踪我循环遍历的列表中的第一个元素。像这样更改它只会导致它连续显示最后一个项目。我认为你不理解这个项目的目的。它应该保持不变。无论如何，我重写了脚本以使其更清晰，并且替换了StartStistItem。