javascript - 我怎样才能让我的 slider 连续循环

Question

我使用这个 jquery 代码使我的推荐部分工作:

$(document).ready(function () {
  var testimonialItem = $(".testimonial-wrapper .testimonial-item");
  var lengthOfItem = testimonialItem.length;
  var counter = 0;  
  testimonialItem.hide();
  setTimeout(function(){
    startIteration(counter);
  }, 1000);
  function startIteration(counter) {
    testimonialItem.eq(counter).fadeIn('slow', function() {
      if(counter<=lengthOfItem){ 
        setTimeout(function(){ 
        testimonialItem.fadeOut('slow',function(){
        if (counter == lengthOfItem) {
            counter = 0;  
        }
        else{
            counter++;
        }
        setTimeout(function(){ 
            startIteration(counter);
        }, 500);    
        });
        }, 2000);
      }
    });
  }
});

看穿我的pen ，我意识到离开链接几分钟后，当我返回时， slider 消失了。 有没有办法解决这个问题，让 slider 一直循环播放？

另外，如何添加导航元素符号，以便每次评价发生变化时，元素符号的颜色也会改变，如您在示例图片中所见？

Here my codepen

Answer 1

老实说，我不能说我已经解决了任何问题。我认为您可能会遇到长期存在的计时器的其他一些问题，但我的谷歌搜索没有找到任何结果。

$(document).ready(function () {
  var testimonialItem = $(".testimonial-wrapper .testimonial-item");
  var lengthOfItem = testimonialItem.length;
  testimonialItem.hide();

  setTimeout(startIteration.bind(0), 1000);

  function startIteration(counter) {
    var item = testimonialItem.eq(counter)
    item.fadeIn('slow', function() {
      setTimeout(function() { 
        item.fadeOut('slow', function() {
          startIteration((counter + 1) %  lengthOfItem);  
        });
      }, 2000);
    });
  }
});