Jquery自动图像滑块

我有一个基本的jQuery图像滑块（下面的代码），它在计时器上自动滑动。 我希望它循环，但它在最后一张幻灯片后卡住了。 我刚刚开始使用jQuery，所以可能会遗漏一些明显的东西，但我无法弄清楚出了什么问题！ 有人可以帮忙吗？

这是代码……

$(document).ready(function() { //INDEX IMAGES SLIDER $(function() { //configuration var width = 720; var speed = 1000; var pause = 3000; var current = 1; //cache DOM var $slider = $('#slider'); var $slides = $slider.find('#slides'); var $slide = $slides.find('.slide'); setInterval(function() { //move image the defined width and speed to the left $slides.animate({'margin-left': '-='+width}, speed, function() { //count number of slides and loop back to first from last current++; if (current === $slides.length) { current = 1; $slides.css('margin-left', 0); } }); }, pause); }); }); 

 #slider { width: 720px; height: 400px; overflow: hidden; } #slider #slides { display: block; width: 2880px; height: 400px; margin: 0; padding: 0; } #slider .slide { float: left; list-style: none; height: 400px; width: 720px; } #slider .slide img { width: 100%; } 

Answer 1

你有一点错误。 $ slides.length是1，因为只有1个div具有该id。 因此，您真正想要使用的是if语句中的$ slide.length。 因为页面上有这么多幻灯片。 因此，如果您按如下所示更改if语句，它应该工作：

 if (current === $slide.length) {