Пытаясь увидеть эту карусель, делающую бесконечные круги. После последнего изображения снова увидите первое изображение, а перед первым - последнее изображение.

Был использован этот

Jquery:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

$(document).ready(function() {  

        $('#carousel_ul li:first').before($('#carousel_ul li:last'));  

        $('#right_scroll img').click(function(){  

            var item_width = $('#carousel_ul li').outerWidth() + 10;  

            var left_indent = parseInt($('#carousel_ul').css('left')) - item_width;  

            $('#carousel_ul').animate({'left' : left_indent},{queue:false, duration:500},function(){  

                $('#carousel_ul li:last').after($('#carousel_ul li:first'));  

                $('#carousel_ul').css({'left' : '-210px'});  
            });  
        });  


        $('#left_scroll img').click(function(){  

            var item_width = $('#carousel_ul li').outerWidth() + 10;  

            var left_indent = parseInt($('#carousel_ul').css('left')) + item_width;  

            $('#carousel_ul').animate({'left' : left_indent},{queue:false, duration:500},function(){  

            $('#carousel_ul li:first').before($('#carousel_ul li:last'));  

            $('#carousel_ul').css({'left' : '-210px'});  
            });  

        });  
  });  

CSS

#carousel_inner { float:left; width:90%; overflow: hidden; }
#carousel_ul {position:relative; left:-210px; list-style-type: none; margin: 0px; padding: 0px; width:9999px; padding-bottom:10px;}
#carousel_ul li{float: left;width:200px; padding:0px; height:110px;background: #FFF;margin-top:10px;margin-bottom:10px;margin-left:5px;margin-right:5px;}
#carousel_ul li img {.margin-bottom:-4px; cursor:pointer; cursor: hand; border:0px;}
#left_scroll, #right_scroll{float:left; height:130px; width:5%;}
#left_scroll img, #right_scroll img{cursor: pointer; cursor: hand;}

http://jsfiddle.net/w35p0xdy/