Advertisement
Guest User

EasySlider 1.7

a guest
Jun 26th, 2012
424
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /*
  2.  *  Easy Slider 1.7 - jQuery plugin
  3.  *  written by Alen Grakalic   
  4.  *  http://cssglobe.com/post/4004/easy-slider-15-the-easiest-jquery-plugin-for-sliding
  5.  *
  6.  *  Copyright (c) 2009 Alen Grakalic (http://cssglobe.com)
  7.  *  Dual licensed under the MIT (MIT-LICENSE.txt)
  8.  *  and GPL (GPL-LICENSE.txt) licenses.
  9.  *
  10.  *  Built for jQuery library
  11.  *  http://jquery.com
  12.  *
  13.  */
  14.  
  15. /*
  16.  *  markup example for $("#slider").easySlider();
  17.  * 
  18.  *  <div id="slider">
  19.  *      <ul>
  20.  *          <li><img src="images/01.jpg" alt="" /></li>
  21.  *          <li><img src="images/02.jpg" alt="" /></li>
  22.  *          <li><img src="images/03.jpg" alt="" /></li>
  23.  *          <li><img src="images/04.jpg" alt="" /></li>
  24.  *          <li><img src="images/05.jpg" alt="" /></li>
  25.  *      </ul>
  26.  *  </div>
  27.  *
  28.  */
  29.  
  30. (function($) {
  31.  
  32.     $.fn.easySlider = function(options){
  33.      
  34.         // default configuration properties
  35.         var defaults = {           
  36.             prevId:         'prevBtn',
  37.             prevText:       'Previous',
  38.             nextId:         'nextBtn', 
  39.             nextText:       'Next',
  40.             controlsShow:   true,
  41.             controlsBefore: '',
  42.             controlsAfter:  '',
  43.             controlsFade:   true,
  44.             firstId:        'firstBtn',
  45.             firstText:      'First',
  46.             firstShow:      false,
  47.             lastId:         'lastBtn', 
  48.             lastText:       'Last',
  49.             lastShow:       false,             
  50.             vertical:       false,
  51.             speed:          800,
  52.             auto:           false,
  53.             pause:          8000,
  54.             continuous:     false,
  55.             numeric:        false,
  56.             numericId:      'controls'
  57.         };
  58.        
  59.         var options = $.extend(defaults, options);  
  60.                
  61.         this.each(function() {  
  62.             var obj = $(this);             
  63.             var s = $("li", obj).length;
  64.             var w = $("li", obj).width();
  65.             var h = $("li", obj).height();
  66.             var clickable = true;
  67.             obj.width(w);
  68.             obj.height(h);
  69.             obj.css("overflow","hidden");
  70.             var ts = s-1;
  71.             var t = 0;
  72.             $("ul", obj).css('width',s*w);         
  73.            
  74.             if(options.continuous){
  75.                 $("ul", obj).prepend($("ul li:last-child", obj).clone().css("margin-left","-"+ w +"px"));
  76.                 $("ul", obj).append($("ul li:nth-child(2)", obj).clone());
  77.                 $("ul", obj).css('width',(s+1)*w);
  78.             };             
  79.            
  80.             if(!options.vertical) $("li", obj).css('float','left');
  81.                                
  82.             if(options.controlsShow){
  83.                 var html = options.controlsBefore;             
  84.                 if(options.numeric){
  85.                     html += '<ol id="'+ options.numericId +'"></ol>';
  86.                 } else {
  87.                     if(options.firstShow) html += '<span id="'+ options.firstId +'"><a href=\"javascript:void(0);\">'+ options.firstText +'</a></span>';
  88.                     html += ' <span id="'+ options.prevId +'"><a href=\"javascript:void(0);\">'+ options.prevText +'</a></span>';
  89.                     html += ' <span id="'+ options.nextId +'"><a href=\"javascript:void(0);\">'+ options.nextText +'</a></span>';
  90.                     if(options.lastShow) html += ' <span id="'+ options.lastId +'"><a href=\"javascript:void(0);\">'+ options.lastText +'</a></span>';             
  91.                 };
  92.                
  93.                 html += options.controlsAfter;                     
  94.                 $(obj).after(html);                                    
  95.             };
  96.            
  97.             if(options.numeric){                                   
  98.                 for(var i=0;i<s;i++){                      
  99.                     $(document.createElement("li"))
  100.                         .attr('id',options.numericId + (i+1))
  101.                         .html('<a rel='+ i +' href=\"javascript:void(0);\">'+ (i+1) +'</a>')
  102.                         .appendTo($("#"+ options.numericId))
  103.                         .click(function(){                         
  104.                             animate($("a",$(this)).attr('rel'),true);
  105.                         });                                                
  106.                 };                         
  107.             } else {
  108.                 $("a","#"+options.nextId).click(function(){    
  109.                     animate("next",true);
  110.                 });
  111.                 $("a","#"+options.prevId).click(function(){    
  112.                     animate("prev",true);              
  113.                 });
  114.                 $("a","#"+options.firstId).click(function(){       
  115.                     animate("first",true);
  116.                 });            
  117.                 $("a","#"+options.lastId).click(function(){    
  118.                     animate("last",true);              
  119.                 });            
  120.             };
  121.            
  122.             function setCurrent(i){
  123.                 i = parseInt(i)+1;
  124.                 $("li", "#" + options.numericId).removeClass("current");
  125.                 $("li#" + options.numericId + i).addClass("current");
  126.             };
  127.            
  128.             function adjust(){
  129.                 if(t>ts) t=0;      
  130.                 if(t<0) t=ts;  
  131.                 if(!options.vertical) {
  132.                     $("ul",obj).css("margin-left",(t*w*-1));
  133.                 } else {
  134.                     $("ul",obj).css("margin-left",(t*h*-1));
  135.                 }
  136.                 clickable = true;
  137.                 if(options.numeric) setCurrent(t);
  138.             };
  139.            
  140.             function animate(dir,clicked){
  141.                 if (clickable){
  142.                     clickable = false;
  143.                     var ot = t;            
  144.                     switch(dir){
  145.                         case "next":
  146.                             t = (ot>=ts) ? (options.continuous ? t+1 : ts) : t+1;                      
  147.                             break;
  148.                         case "prev":
  149.                             t = (t<=0) ? (options.continuous ? t-1 : 0) : t-1;
  150.                             break;
  151.                         case "first":
  152.                             t = 0;
  153.                             break;
  154.                         case "last":
  155.                             t = ts;
  156.                             break;
  157.                         default:
  158.                             t = dir;
  159.                             break;
  160.                     }; 
  161.                     var diff = Math.abs(ot-t);
  162.                     var speed = diff*options.speed;                    
  163.                     if(!options.vertical) {
  164.                         p = (t*w*-1);
  165.                         $("ul",obj).animate(
  166.                             { marginLeft: p },
  167.                             { queue:false, duration:speed, complete:adjust }
  168.                         );             
  169.                     } else {
  170.                         p = (t*h*-1);
  171.                         $("ul",obj).animate(
  172.                             { marginTop: p },
  173.                             { queue:false, duration:speed, complete:adjust }
  174.                         );                 
  175.                     };
  176.                    
  177.                     if(!options.continuous && options.controlsFade){                   
  178.                         if(t==ts){
  179.                             $("a","#"+options.nextId).hide();
  180.                             $("a","#"+options.lastId).hide();
  181.                         } else {
  182.                             $("a","#"+options.nextId).show();
  183.                             $("a","#"+options.lastId).show();                  
  184.                         };
  185.                         if(t==0){
  186.                             $("a","#"+options.prevId).hide();
  187.                             $("a","#"+options.firstId).hide();
  188.                         } else {
  189.                             $("a","#"+options.prevId).show();
  190.                             $("a","#"+options.firstId).show();
  191.                         };                 
  192.                     };             
  193.                    
  194.                     if(clicked) clearTimeout(timeout);
  195.                     if(options.auto && dir=="next" && !clicked){;
  196.                         timeout = setTimeout(function(){
  197.                             animate("next",false);
  198.                         },diff*options.speed+options.pause);
  199.                     };
  200.            
  201.                 };
  202.                
  203.             };
  204.             // init
  205.             var timeout;
  206.             if(options.auto){;
  207.                 timeout = setTimeout(function(){
  208.                     animate("next",false);
  209.                 },options.pause);
  210.             };     
  211.            
  212.             if(options.numeric) setCurrent(0);
  213.        
  214.             if(!options.continuous && options.controlsFade){                   
  215.                 $("a","#"+options.prevId).hide();
  216.                 $("a","#"+options.firstId).hide();             
  217.             };             
  218.            
  219.         });
  220.      
  221.     };
  222.  
  223. })(jQuery);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement