jQuery Slider空第二循环

Question

我正在实现一个带导航控件的简单图像滑块。

我有两个问题。

1. 有四张幻灯片，代码为每张幻灯片创建四个控件，它循环播放幻灯片，但是在4张幻灯片之后，它再次循环而不通过幻灯片。
2. 我无法点击各个按钮来指引幻灯片......

有人能帮助兄弟吗？

function createNav() {
  var numofslides = sel.children().length;
  console.log(numofslides);

  //alert(countChildren);
  for (var i = 0; i < numofslides; i++) {
    $('ul').append('<li class="circle"></li>');
  }  
}

//Slide function......//
window.time = function() {
  now = setInterval(function() {
    sel.children().eq(0).fadeOut().next().fadeIn().end().appendTo(sel);
    el.children().eq(count).addClass('active').siblings().removeClass('active');
    if (count == el.children().length) {
      el.children().eq(0).addClass('active').siblings().removeClass('active');
      count = 0;
    }
    count++
    //console.log(count);
  }, 2000);

};

https://jsfiddle.net/6qqc9ohf/

Answer 1

这是更新的小提琴 - https://jsfiddle.net/6qqc9ohf/6/

我已解决以下问题：

1. 在创建导航时，您将li添加到ul。所以改变

   $('ul').append('<li class="circle"></li>');

   到

   $('#container').append('<li class="circle"></li>');




1. 在创建导航时，将第一个li设为active。将以下代码添加到createNav()。

   $('#container li:eq(0)').addClass('active');




1. 将计数更改为1. var count = 1;