Javascript 如何连续转换skdslider滑动效果？

下面是skdslider的js，我想做的是，这个滑动效果将持续播放，这意味着在循环中。现在，在5个图像之后，滑块返回到第一个图像，所有图像都是4 3 2 1。我不希望你能理解我的问题。对不起，英语不好

(function($){
    $.skdslider = function(container,options){
        // settings
        var config = {
            'delay': 2000,
            'animationSpeed': 500,
            'showNav':true,
            'autoSlide':true,
            'showNextPrev':false,
            'pauseOnHover':false,
            'numericNav':false,
            'showPlayButton':false,
            'animationType':'sliding', /* fading/sliding */

        };

        if ( options ){$.extend(config, options);}
        // variables

        var touch = (( "ontouchstart" in window ) || window.DocumentTouch && document instanceof DocumentTouch);


        $(container).wrap('<div class="skdslider"></div>');
        var element=$(container).closest('div.skdslider');
        element.find('ul').addClass('slides');
        var slides = element.find('ul.slides li');
        var targetSlide=0;
        config.currentSlide=0;
        config.currentState='pause';
        config.running=false;

        if(config.animationType=='fading'){
           slides.each(function(){$(this).css({'position': 'absolute', 'left': '0','top': '0','bottom':'0','right':'0'});});
        }

        if(config.animationType=='sliding'){
           slides.each(function(){$(this).css({'float': 'left', 'display': 'block','position': 'relative'});});

           var totalWidth=element.outerWidth()*slides.size();
           element.find('ul.slides').css({'position': 'absolute', 'left': '0','width':totalWidth});
           slides.css({'width':element.outerWidth(),'height':element.outerHeight()});

           $( window ).resize(function() {
              var totalWidth=element.outerWidth()*slides.size();
              element.find('ul.slides').css({'position': 'absolute', 'left': '0','width':totalWidth});
              slides.css({'width':element.outerWidth(),'height':element.outerHeight()});
           });
        }

        //if (touch)
        $.skdslider.enableTouch(element,slides, config);

        $.skdslider.createNav(element,slides, config);
        slides.eq(targetSlide).show();
        if (config.autoSlide==true){
           config.currentState='play';  
           config.interval=setTimeout(function() {
                    $.skdslider.playSlide(element,slides, config);
                }, config.delay); 
        }

        if(config.pauseOnHover==true){
           slides.hover(function(){
              if (config.autoSlide==true){                   
                config.currentState='pause'; 
                clearTimeout(config.interval);
              }
           },function(){ 
             if (config.autoSlide==true){       
                 config.currentState='play'; 
                 if(config.autoSlide==true) $.skdslider.playSlide(element,slides, config);
               }
            } );
        }
    };


  $.skdslider.createNav=function(element,slides,config){

            var slideSet ='<ul class="slide-navs">';
            for(i=0;i<slides.length;i++){
              var slideContent='';
              if(config.numericNav==true) slideContent=(i+1);
              if(i==0)
              slideSet+='<li class="current-slide slide-nav-'+i+'"><a>'+slideContent+'</a></li>';
              else
              slideSet+='<li class="slide-nav-'+i+'"><a>'+slideContent+'</a></li>';
            }
            slideSet+='</ul>';



            if (config.showNav==true){
                    element.append(slideSet);
                    var nav_width=element.find('.slide-navs')[0].offsetWidth;
                    nav_width=parseInt((nav_width/2));
                    nav_width=(-1)*nav_width;
                    element.find('.slide-navs').css('margin-left',nav_width);
                    // Slide marker clicked
                    element.find('.slide-navs li').click(function(){
                        index = element.find('.slide-navs li').index(this);
                        targetSlide = index;
                        clearTimeout(config.interval);
                        config.currentState='play';
                        config.running=false;
                        $.skdslider.playSlide(element,slides, config,targetSlide);
                        return false;
                    });
            }

        if (config.showNextPrev==true){
             var nextPrevButton ='<a class="prev"></a>'; 
                 nextPrevButton +='<a class="next"></a>'; 

             element.append(nextPrevButton);

             element.find('a.prev').click(function(){
                 $.skdslider.prev(element,slides, config);                                     
             });

             element.find('a.next').click(function(){
                  $.skdslider.next(element,slides, config);                                
             });
        }

      if (config.showPlayButton==true){

            var playPause =(config.currentState=='play' || config.autoSlide==true)?'<a class="play-control pause"></a>':'<a class="play-control play"></a>';  
            element.append(playPause);          
            element.hover(function(){element.find('a.play-control').css('display','block');},function(){element.find('a.play-control').css('display','none');});

            element.find('a.play-control').click(function(){

                    if(config.autoSlide==true)
                    {
                       clearTimeout(config.interval);
                       config.autoSlide=false;
                       config.currentState='pause';
                       $(this).addClass('play');
                       $(this).removeClass('pause');
                    }
                    else
                    {
                       config.currentState='play';
                       config.autoSlide=true;
                       $(this).addClass('pause');
                       $(this).removeClass('play');

                       if((config.currentSlide+1)==slides.length)targetSlide = 0;
                       else targetSlide = (config.currentSlide+1);

                       clearTimeout(config.interval);
                       $.skdslider.playSlide(element,slides, config,targetSlide);
                    }   
                   return false;
             });
      }

  };

 $.skdslider.next=function(element,slides,config){
    if((config.currentSlide+1)==slides.length)targetSlide = 0;
    else targetSlide = (config.currentSlide+1);

    clearTimeout(config.interval);
    config.currentState='play';
    $.skdslider.playSlide(element,slides, config,targetSlide);
    return false;
 }

 $.skdslider.prev=function(element,slides,config){
    if(config.currentSlide==0)targetSlide = (slides.length-1);
    else targetSlide = (config.currentSlide-1);

    clearTimeout(config.interval);
    config.currentState='play';
    config.running=false;
    $.skdslider.playSlide(element,slides, config,targetSlide);
    return true;
 }

 $.skdslider.prev=function(element,slides,config){
    if(config.currentSlide==0)targetSlide = (slides.length-1);
    else targetSlide = (config.currentSlide-1);

    clearTimeout(config.interval);
    config.currentState='play';
    config.running=false;
    $.skdslider.playSlide(element,slides, config,targetSlide);
    return true;
 }

 $.skdslider.playSlide=function(element,slides,config,targetSlide){

        if(config.currentState=='play' && config.running==false){

                element.find('.slide-navs li').removeClass('current-slide');
                if(typeof (targetSlide)=='undefined'){
                      targetSlide = ( config.currentSlide+1 == slides.length ) ? 0 : config.currentSlide+1;
                }
                if(config.animationType=='fading'){
                    config.running=true;
                    slides.eq(config.currentSlide).fadeOut(config.animationSpeed);
                    slides.eq(targetSlide).fadeIn(config.animationSpeed, function() {                                                    
                        $.skdslider.removeIEFilter($(this)[0]);
                         config.running=false;      
                    });
                }
                if(config.animationType=='sliding'){
                    var left=(targetSlide*element.outerWidth())*(-1);
                    config.running=true;
                    element.find('ul.slides').animate({left:left}, config.animationSpeed,function(){
                      config.running=false;                                                                      
                    });
                }
                element.find('.slide-navs li').eq(targetSlide).addClass('current-slide');
                config.currentSlide=targetSlide;
        }

      if (config.autoSlide==true && config.currentState=='play'){
            config.interval=setTimeout((function() {
                $.skdslider.playSlide(element,slides, config);
            }), config.delay);
      }
  };

  $.skdslider.enableTouch=function(element,slides,config){
      element[0].addEventListener('touchstart', onTouchStart, false);
       var startX;
       var startY;
       var dx;
       var dy;

       function onTouchStart(e){
           startX = e.touches[0].pageX;
           startY = e.touches[0].pageY; 
           element[0].addEventListener('touchmove', onTouchMove, false);
           element[0].addEventListener('touchend', onTouchEnd, false);
       }

       function onTouchMove(e) {
                 e.preventDefault();
                 var x = e.touches[0].pageX;
                 var y = e.touches[0].pageY;
                 dx = startX - x;
                 dy = startY - y;
      }

     function onTouchEnd(e) {
                 element[0].removeEventListener('touchmove', onTouchMove, false);
                 if(dx>0){
                      $.skdslider.next(element,slides, config);      
                 }else{
                     $.skdslider.prev(element,slides, config);           
                 }
                 element[0].removeEventListener('touchend', onTouchEnd, false);
         }  
  }


  $.skdslider.removeIEFilter=function(elm){
      if(elm.style.removeAttribute){
        elm.style.removeAttribute('filter');
       }  
  }

 $.fn.skdslider = function(options){
        return this.each(function(){
            (new $.skdslider(this,options));
        });
    };

})(jQuery);

（函数（$）{
$.skdslider=函数（容器、选项）{
//背景
变量配置={
"延迟":2000年,，
“动画速度”：500，
“showNav”：正确，
“自动滑动”：正确，
'showNextPrev'：false，
“pauseOnHover”：false，
“numericNav”：错误，
“showPlayButton”：false，
'动画类型'：'滑动'，/*淡入/滑动*/
};
如果（选项）{$.extend（配置，选项）；}
//变数
var touch=（“窗口中的ontouchstart”）| | window.DocumentTouch和DocumentTouch的documentinstanceof DocumentTouch）；
$（容器）。包装（“”）；
var元素=$（容器）.closest（'div.skdslider'）；
元素。查找（'ul'）。添加类（'slides'）；
var slides=element.find（'ul.slides li'）；
var-targetSlide=0；
config.currentSlide=0；
config.currentState='pause'；
config.running=false；
如果（config.animationType=='facing'）{
每个（函数（）{$（this）.css（{'position'：'absolute'，'left'：'0'，'top'：'0'，'bottom'：'0'，'right'：'0'}）；}）；
}
if（config.animationType=='slideing'）{
slides.each（function（）{$（this）.css（{'float'：'left'，'display'：'block'，'position'：'relative'}）；}）；
var totalWidth=element.outerWidth（）*slides.size（）；
css（{'position'：'absolute'，'left'：'0'，'width'：totalWidth}）；
css（{'width'：element.outerWidth（），'height'：element.outerHeight（）}）；
$（窗口）。调整大小（函数（）{
var totalWidth=element.outerWidth（）*slides.size（）；
css（{'position'：'absolute'，'left'：'0'，'width'：totalWidth}）；
css（{'width'：element.outerWidth（），'height'：element.outerHeight（）}）；
});
}
//如果（触摸）
$.skdslider.enableTouch（元素、幻灯片、配置）；
$.skdslider.createNav（元素、幻灯片、配置）；
slides.eq（targetSlide.show（）；
if（config.autoSlide==true）{
config.currentState='play'；
config.interval=setTimeout（函数（）{
$.skdslider.playSlide（元素、幻灯片、配置）；
}，config.delay）；
}
if（config.pauseonhaver==true）{
slides.hover（函数（）{
如果（config.autoSlide==true）{
config.currentState='pause'；
clearTimeout（配置间隔）；
}
}，函数（）{
如果（config.autoSlide==true）{
config.currentState='play'；
if（config.autoSlide==true）$.skdslider.playSlide（元素，幻灯片，配置）；
}
} );
}
};
$.skdslider.createNav=函数（元素、幻灯片、配置）{
var slideSet='
'；
对于（i=0；i0）{
$.skdslider.next（元素、幻灯片、配置）；
}否则{
$.skdslider.prev（元素、幻灯片、配置）；
}
元素[0]。removeEventListener（'touchend'，onTouchEnd，false）；
}  
}
$.skdslider.removiefilter=函数（elm）{
if（elm.style.removeAttribute）{
elm.style.removeAttribute（'filter'）；
}  
}
$.fn.skdslider=功能（选项）{
返回此值。每个（函数（）{
（新的$.skdslider（本，选项））；
});
};
})（jQuery）；

我建议使用

bxlider

或者使用已经内置了此功能的东西。实际上，我在页面的任何地方都使用了此滑块。这就是为什么不能更改滑块。我想在此滑块中进行编辑。如果没有选项，那么将使用bxslider。但我认为jQueryJavaScript专家会解决这个问题。