Simple Jquery Brand Scroller

A snippet of code for writing a Jquery carousel that scrolls continuously.

Jquery


carouselul = $('.unorderedlist');
var carouseloffset = 0;

function scrollcarousel() {
    carouseloffset = 0;
    currentslide = carouselul.find('li').eq(0);
    carouseloffset = currentslide.width();

     carouselul.animate({
       left: -carouseloffset
     }, 2000, function() {
      currentslide.appendTo(carouselul);
        carouselul.css({left: 0});
     });
}

$(document).ready(function() {

  setInterval(scrollcarousel, 4000);

});

HTML Markup

<ul class="unorderedlist">
	<li><a href="#"><img src="http://www.lorempixum.com/200/50" alt="Some alt text" /></a></li>
	<li><a href="#"><img src="http://www.lorempixum.com/200/150" alt="Some alt text" /></a></li>
	<li><a href="#"><img src="http://www.lorempixum.com/200/50" alt="Some alt text" /></a></li>
	<li><a href="#"><img src="http://www.lorempixum.com/200/60" alt="Some alt text" /></a></li>
	<li><a href="#"><img src="http://www.lorempixum.com/200/30" alt="Some alt text" /></a></li>
	<li><a href="#"><img src="http://www.lorempixum.com/200/100" alt="Some alt text" /></a></li>
	<li><a href="#"><img src="http://www.lorempixum.com/200/120" alt="Some alt text" /></a></li>
	<li><a href="#"><img src="http://www.lorempixum.com/200/30" alt="Some alt text" /></a></li>
	<li><a href="#"><img src="http://www.lorempixum.com/200/200" alt="Some alt text" /></a></li>
</ul>
 <!-- end of unordered list -->

CSS

.unorderedlist {
  float:left;
  width:100%;
  display:inline;
  clear:both;
}

.unorderedlist li {
  float:left;
  display:inline;
}