Jquery 定制Easy Slider 1.7，使其褪色而非滑动

我正在使用这个插件：

我对jquery很陌生，我想知道是否有人能告诉我如何将图像更改为淡入淡出而不是滑动

(function($) {

 $.fn.easySlider = function(options){

  // default configuration properties
  var defaults = {   
   prevId:   'prevBtn',
   prevText:   'Previous',
   nextId:   'nextBtn', 
   nextText:   'Next',
   controlsShow: true,
   controlsBefore: '',
   controlsAfter: '', 
   controlsFade: true,
   firstId:   'firstBtn',
   firstText:   'First',
   firstShow:  false,
   lastId:   'lastBtn', 
   lastText:   'Last',
   lastShow:  false,    
   vertical:  false,
   speed:    800,
   auto:   true,
   pause:   2000,
   continuous:  true, 
   numeric:   true,
   numericId:   'controls'
  }; 

  var options = $.extend(defaults, options);  

  this.each(function() {  
   var obj = $(this);     
   var s = $("li", obj).length;
   var w = $("li", obj).width(); 
   var h = $("li", obj).height(); 
   var clickable = true;
   obj.width(w); 
   obj.height(h); 
   obj.css("overflow","hidden");
   var ts = s-1;
   var t = 0;
   $("ul", obj).css('width',s*w);   

   if(options.continuous){
    $("ul", obj).prepend($("ul li:last-child", obj).clone().css("margin-left","-"+ w +"px"));
    $("ul", obj).append($("ul li:nth-child(2)", obj).clone());
    $("ul", obj).css('width',(s+1)*w);
   };    

   if(!options.vertical) $("li", obj).css('float','left');

   if(options.controlsShow){
    var html = options.controlsBefore;    
    if(options.numeric){
     html += '<ol id="'+ options.numericId +'"></ol>';
    } else {
     if(options.firstShow) html += '<span id="'+ options.firstId +'"><a href=\"javascript:void(0);\">'+ options.firstText +'</a></span>';
     html += ' <span id="'+ options.prevId +'"><a href=\"javascript:void(0);\">'+ options.prevText +'</a></span>';
     html += ' <span id="'+ options.nextId +'"><a href=\"javascript:void(0);\">'+ options.nextText +'</a></span>';
     if(options.lastShow) html += ' <span id="'+ options.lastId +'"><a href=\"javascript:void(0);\">'+ options.lastText +'</a></span>';    
    };

    html += options.controlsAfter;      
    $(obj).after(html);          
   };

   if(options.numeric){         
    for(var i=0;i<s;i++){      
     $(document.createElement("li"))
      .attr('id',options.numericId + (i+1))
      .html('<a rel='+ i +' href=\"javascript:void(0);\">'+ (i+1) +'</a>')
      .appendTo($("#"+ options.numericId))
      .click(function(){       
       animate($("a",$(this)).attr('rel'),true);
      });             
    };       
   } else {
    $("a","#"+options.nextId).click(function(){  
     animate("next",true);
    });
    $("a","#"+options.prevId).click(function(){  
     animate("prev",true);    
    }); 
    $("a","#"+options.firstId).click(function(){  
     animate("first",true);
    });    
    $("a","#"+options.lastId).click(function(){  
     animate("last",true);    
    });    
   };

   function setCurrent(i){
    i = parseInt(i)+1;
    $("li", "#" + options.numericId).removeClass("current");
    $("li#" + options.numericId + i).addClass("current");
   };

   function adjust(){
    if(t>ts) t=0;  
    if(t<0) t=ts; 
    if(!options.vertical) {
     $("ul",obj).css("margin-left",(t*w*-1));
    } else {
     $("ul",obj).css("margin-left",(t*h*-1));
    }
    clickable = true;
    if(options.numeric) setCurrent(t);
   };

   function animate(dir,clicked){
    if (clickable){
     clickable = false;
     var ot = t;    
     switch(dir){
      case "next":
       t = (ot>=ts) ? (options.continuous ? t+1 : ts) : t+1;      
       break; 
      case "prev":
       t = (t<=0) ? (options.continuous ? t-1 : 0) : t-1;
       break; 
      case "first":
       t = 0;
       break; 
      case "last":
       t = ts;
       break; 
      default:
       t = dir;
       break; 
     }; 
     var diff = Math.abs(ot-t);
     var speed = diff*options.speed;      
     if(!options.vertical) {
      p = (t*w*-1);
      $("ul",obj).animate(
       { marginLeft: p }, 
       { queue:false, duration:speed, complete:adjust }
      );    
     } else {
      p = (t*h*-1);
      $("ul",obj).animate(
       { marginTop: p }, 
       { queue:false, duration:speed, complete:adjust }
      );     
     };

     if(!options.continuous && options.controlsFade){     
      if(t==ts){
       $("a","#"+options.nextId).hide();
       $("a","#"+options.lastId).hide();
      } else {
       $("a","#"+options.nextId).show();
       $("a","#"+options.lastId).show();     
      };
      if(t==0){
       $("a","#"+options.prevId).hide();
       $("a","#"+options.firstId).hide();
      } else {
       $("a","#"+options.prevId).show();
       $("a","#"+options.firstId).show();
      };     
     };    

     if(clicked) clearTimeout(timeout);
     if(options.auto && dir=="next" && !clicked){;
      timeout = setTimeout(function(){
       animate("next",false);
      },diff*options.speed+options.pause);
     };

    };

   };
   // init
   var timeout;
   if(options.auto){;
    timeout = setTimeout(function(){
     animate("next",false);
    },options.pause);
   };  

   if(options.numeric) setCurrent(0);

   if(!options.continuous && options.controlsFade){     
    $("a","#"+options.prevId).hide();
    $("a","#"+options.firstId).hide();    
   };    

  });

 };

})(jQuery);

（函数（$）{
$.fn.easySlider=函数（选项）{
//默认配置属性
变量默认值={
prevId:'prevBtn'，
prevText:“上一个”，
nextId:'nextBtn'，
下一步：“下一步”，
控制显示：正确，
控件之前：“”，
controlsAfter:“”，
正面：对，
firstId:'firstBtn'，
firstText:'第一'，
第一秀：假，
lastId:'lastBtn'，
lastText:'最后'，
lastShow:false，
垂直：假，
速度:800,，
是的，
暂停：2000年，
是的，
数字：对，
numericId:“控件”
}; 
var options=$.extend（默认值，选项）；
此.each（function（）{
var obj=$（本）；
var s=$（“li”，obj）。长度；
var w=$（“li”，obj）.width（）；
var h=$（“li”，obj）.height（）；
var clickable=true；
物体宽度（w）；
物体高度（h）；
对象css（“溢出”、“隐藏”）；
var ts=s-1；
var t=0；
$（“ul”，obj）.css（'宽度'，s*w）；
如果（选项。连续）{
$（ul，obj）.prepend（$（ul-li:last-child，obj）.clone（）.css（“左边距”，“-”+w+“px”）；
$（$ul，obj）.append（$（$ul-li:nth-child（2）”，obj.clone（））；
$（“ul”，obj）.css（'width'，（s+1）*w）；
};    
如果（！options.vertical）$（“li”，obj.css（'float'，'left'）；
if（选项.控件显示）{
var html=options.controlsBefore；
如果（选项.数字）{
html+=''；
}否则{
如果（options.firstShow）html+=''；
html+=''；
html+=''；
如果（options.lastShow）html+=''；
};
html+=options.controlsAfter；
$（obj）.after（html）；
};
if（options.numeric）{
对于（var i=0；its）t=0；
如果（t=ts）？（选项连续？t+1:ts）：t+1；
打破
案例“prev”：
t=（t这个特定的插件不是为淡入淡出而构建的。
找到它

if(!options.vertical) {
                    p = (t*w*-1);
                    $("ul",obj).animate(
                        { marginLeft: p }, 
                        { queue:false, duration:speed, complete:adjust }
                    );              
                } 

并将其更改为

if(!options.vertical) {
                    p = (t*w*-1);
                    $("ul",obj).animate(
                        { opacity: 0 }, 
                        { queue:false, duration:'slow', complete:adjust }
                    );  

                }

if(!options.vertical) {
                $("ul",obj).css("margin-left",(t*w*-1));
                $("ul",obj).animate(
                        { opacity: 1 }, 
                        { queue:false, duration:'slow'}
                    );  
            }

然后找到这个

if(!options.vertical) {
                $("ul",obj).css("margin-left",(t*w*-1));
            }

并将其更改为

if(!options.vertical) {
                    p = (t*w*-1);
                    $("ul",obj).animate(
                        { opacity: 0 }, 
                        { queue:false, duration:'slow', complete:adjust }
                    );  

                }

if(!options.vertical) {
                $("ul",obj).css("margin-left",(t*w*-1));
                $("ul",obj).animate(
                        { opacity: 1 }, 
                        { queue:false, duration:'slow'}
                    );  
            }

我希望这对你有帮助