Infinited Slide Scroller (jQuery)
For StackOveflow Question: http://stackoverflow.com/questions/9945145/how-do-i-make-this-slider-javascript-to-simply-rotate-images-infinitely/9946187#9946187
HTML
<ul id="slides">
<li>Slide1</li>
<li>Slide2</li>
<li>Slide3</li>
<li>Slide4</li>
<li>Slide5</li>
<li>Slide6</li>
</ul>
CSS
ul#slides {position:relative; width:400px; height:200px; overflow:hidden;}
ul#slides > li {
position:absolute;
top:0px;
left:100%;
width:100%;
height:100%;
background:#000;
color:#FFF;
z-index:1;
}
ul#slides > li:nth-child(even) {background:#fff;}
JavaScript
if ($('#slides').length != 0) {
var currentIndex = 0, slides = $('#slides > li');
$(slides[currentIndex]).css('left','0%');
function slide() {
var current, next;
current = $(slides[currentIndex]);
currentIndex++;
if(currentIndex === slides.length){
currentIndex = 0;
}
next = $(slides[currentIndex]);
next.css('left','100%');
next.css('z-index',parseInt(current.css('z-index'), 10)+1);
next.animate({left: '0%'}, 1000);
}
var s = window.setInterval(slide, 3000);
}