尝试制作旋转木马滑块

Question

im trying to make a simple carousel slider with 3 slides with some content inside, now the problem is that i cant make to go to the first slide when im on the last one, so i would be thankful if anyone can give few pointers where im wrong.

Take a look:

http://codepen.io/anon/pen/bNpYLB enter code here

Answer 1

Add a slide class to each slide. Optionally, declare slider-content[x] as an id (don't forget to modify the CSS accordingly):

<div class="slide" id="slider-content3">

Conduct analogical operation on the dots list:

 <ul class="slider-dots"> <li class="dot active-dot">&bull;</li> <li class="dot">&bull;</li> <li class="dot">&bull;</li> </ul> 

And change your javascript to:

  if(nextSlide.length === 0) { nextSlide = $('.slide').first(); nextDot = $('.dot').first(); } 

Check on Codepen if it's the desired behaviour.