Карусель с использованием jQuery ⇐ CSS

[Anonymous]

Я знаю, что есть плагины, доступные там, но я пытаюсь сделать один из себя, и до этого я пытаюсь понять концепцию сделать его как бесконечную/круговую карусель. Вот мой jsfiddle до сих пор .. http://jsfiddle.net/hbk35/kpkyz/3/
html:

• 0
• 1
• 2
• 3
• 4
• 5
• 6
• 7

left
right

< /code>
js: < /p>
var container = $("#carousel_wrapper");

var runner = container.find('ul');
var liWidth = runner.find('li:first').outerWidth();
var itemsPerPage = 3;
var noofitems = runner.find('li').length;

runner.width(noofitems * liWidth);
container.width(itemsPerPage*liWidth);

$('#right').on('click',function(){
runner.animate({scrollLeft: -liWidth},1000);
});

$('#left').on('click',function(){
runner.animate({scrollLeft: liWidth},1000);
});
< /code>
css: < /p>
div#carousel_wrapper{

overflow:hidden;
position:relative;
}

ul {
padding:0px;
margin:0px;
}
ul li {
list-style:none;
float:left;
}
ul li div {
border:1px solid white;
width:50px;
height:50px;
background-color:gray;
}
< /code>
Я не хочу использовать метод клона и отсоединения. Есть ли другой способ сделать это?

Подробнее здесь: https://stackoverflow.com/questions/220 ... ing-jquery