为了学习,我想在 Jquery 中创建一个垂直的无限轮播,轮播在第一个 cicle 中工作得很好,但之后它停止并开始复制元素......有谁知道我做错了什么?
Thank you.
http://jsfiddle.net/boumaig/685TP/2/
$(function($){
$next = $('.next');
$list = $('li');
$q = 0;
var aux = {
clone_ithem : function(list){
this.list = list;
list.eq($q).clone(true).appendTo('ul')
},
remove_ithem : function(list){
this.list = list;
list.eq($q).remove();
if($q <= $list.length - 2){
$q++;
}else{
$q = 0;
}
}
}
$next.click(function(event){
aux.clone_ithem($list);
aux.remove_ithem($list);
event.preventDefault();
});
//Jquery END Line
});
网页代码 :
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
</ul>
<div id="nav">
<a href="#" class="next">next</a>
</div>
与其克隆和删除元素,不如考虑通过在ul末尾附加第一个元素来切换位置。
法典:
$(function ($) {
$next = $('.next');
$list = $('ul');
var aux = {
clone_item: function (list) {
this.list = list
$(list).find('li:first').appendTo(list);
}
}
$next.click(function (event) {
aux.clone_item($list);
event.preventDefault();
});
});
演示:http://jsfiddle.net/IrvinDominin/Tj4c2/