从头开始在jQuery中垂直无限旋转木马



为了学习,我想在 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/