Advertisement
Guest User

Untitled

a guest
Jul 6th, 2011
204
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
jQuery 6.82 KB | None | 0 0
  1. /*
  2.  *  easyAccordion 0.1 - jQuery plugin
  3.  *  written by Andrea Cima Serniotti   
  4.  *  http://www.madeincima.eu
  5.  *
  6.  *  Copyright (c) 2010 Andrea Cima Serniotti (http://www.madeincima.eu)
  7.  *  Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
  8.  *  Built for jQuery library http://jquery.com
  9.  */
  10.  
  11. (function(jQuery) {
  12.     jQuery.fn.easyAccordion = function(options) {
  13.    
  14.     var defaults = {           
  15.         slideNum: true,
  16.         autoStart: false,
  17.         slideInterval: 3000
  18.     };
  19.            
  20.     this.each(function() {
  21.        
  22.         var settings = jQuery.extend(defaults, options);       
  23.         jQuery(this).find('dl').addClass('easy-accordion');
  24.        
  25.        
  26.         // -------- Set the variables ------------------------------------------------------------------------------
  27.        
  28.         jQuery.fn.setVariables = function() {
  29.             dlWidth = jQuery(this).width();
  30.             dlHeight = jQuery(this).height();
  31.             dtWidth = jQuery(this).find('dt').outerHeight();
  32.             if (jQuery.browser.msie){ dtWidth = $(this).find('dt').outerWidth();}
  33.             dtHeight = dlHeight - (jQuery(this).find('dt').outerWidth()-jQuery(this).find('dt').width());
  34.             slideTotal = jQuery(this).find('dt').size();
  35.             ddWidth = dlWidth - (dtWidth*slideTotal) - (jQuery(this).find('dd').outerWidth(true)-jQuery(this).find('dd').width());
  36.             ddHeight = dlHeight - (jQuery(this).find('dd').outerHeight(true)-jQuery(this).find('dd').height());
  37.         };
  38.         jQuery(this).setVariables();
  39.    
  40.        
  41.         // -------- Fix some weird cross-browser issues due to the CSS rotation -------------------------------------
  42.  
  43.         if (jQuery.browser.safari){ var dtTop = (dlHeight-dtWidth)/2; var dtOffset = -dtTop;  /* Safari and Chrome */ }
  44.         if (jQuery.browser.mozilla){ var dtTop = dlHeight - 20; var dtOffset = - 20; /* FF */ }
  45.         if (jQuery.browser.msie){ var dtTop = 0; var dtOffset = 0; /* IE */ }
  46.        
  47.        
  48.         // -------- Getting things ready ------------------------------------------------------------------------------
  49.        
  50.         var f = 1;
  51.         jQuery(this).find('dt').each(function(){
  52.             jQuery(this).css({'width':dtHeight,'top':dtTop,'margin-left':dtOffset});   
  53.             if(settings.slideNum == true){
  54.                 jQuery('<span class="slide-number">'+0+f+'</span>').appendTo(this);
  55.                 if(jQuery.browser.msie){   
  56.                     var slideNumLeft = parseInt(jQuery(this).find('.slide-number').css('left')) - 14;
  57.                     jQuery(this).find('.slide-number').css({'left': slideNumLeft})
  58.                     if(jQuery.browser.version == 6.0 || jQuery.browser.version == 7.0){
  59.                         jQuery(this).find('.slide-number').css({'bottom':'auto'});
  60.                     }
  61.                     if(jQuery.browser.version == 8.0){
  62.                     var slideNumTop = jQuery(this).find('.slide-number').css('bottom');
  63.                     var slideNumTopVal = parseInt(slideNumTop) + parseInt(jQuery(this).css('padding-top'))  - 12;
  64.                     jQuery(this).find('.slide-number').css({'bottom': slideNumTopVal});
  65.                     }
  66.                 } else {
  67.                     var slideNumTop = jQuery(this).find('.slide-number').css('bottom');
  68.                     var slideNumTopVal = parseInt(slideNumTop) + parseInt(jQuery(this).css('padding-top'));
  69.                     jQuery(this).find('.slide-number').css({'bottom': slideNumTopVal});
  70.                 }
  71.             }
  72.             f = f + 1;
  73.         });
  74.        
  75.         if(jQuery(this).find('.active').size()) {
  76.             jQuery(this).find('.active').next('dd').addClass('active');
  77.         } else {
  78.             jQuery(this).find('dt:first').addClass('active').next('dd').addClass('active');
  79.         }
  80.        
  81.         jQuery(this).find('dt:first').css({'left':'0'}).next().css({'left':dtWidth});
  82.         jQuery(this).find('dd').css({'width':ddWidth,'height':ddHeight});  
  83.  
  84.        
  85.         // -------- Functions ------------------------------------------------------------------------------
  86.        
  87.         jQuery.fn.findActiveSlide = function() {
  88.                 var i = 1;
  89.                 this.find('dt').each(function(){
  90.                 if(jQuery(this).hasClass('active')){
  91.                     activeID = i; // Active slide
  92.                 } else if (jQuery(this).hasClass('no-more-active')){
  93.                     noMoreActiveID = i; // No more active slide
  94.                 }
  95.                 i = i + 1;
  96.             });
  97.         };
  98.            
  99.         jQuery.fn.calculateSlidePos = function() {
  100.             var u = 2;
  101.             jQuery(this).find('dt').not(':first').each(function(){ 
  102.                 var activeDtPos = dtWidth*activeID;
  103.                 if(u <= activeID){
  104.                     var leftDtPos = dtWidth*(u-1);
  105.                     jQuery(this).animate({'left': leftDtPos});
  106.                     if(u < activeID){ // If the item sits to the left of the active element
  107.                         jQuery(this).next().css({'left':leftDtPos+dtWidth});   
  108.                     } else{ // If the item is the active one
  109.                         jQuery(this).next().animate({'left':activeDtPos});
  110.                     }
  111.                 } else {
  112.                     var rightDtPos = dlWidth-(dtWidth*(slideTotal-u+1));
  113.                     jQuery(this).animate({'left': rightDtPos});
  114.                     var rightDdPos = rightDtPos+dtWidth;
  115.                     jQuery(this).next().animate({'left':rightDdPos});  
  116.                 }
  117.                 u = u+ 1;
  118.             });
  119.             setTimeout( function() {
  120.                 jQuery('.easy-accordion').find('dd').not('.active').each(function(){
  121.                     jQuery(this).css({'display':'none'});
  122.                 });
  123.             }, 400);
  124.            
  125.         };
  126.    
  127.         jQuery.fn.activateSlide = function() {
  128.             this.parent('dl').setVariables();  
  129.             this.parent('dl').find('dd').css({'display':'block'});
  130.             this.parent('dl').find('dd.plus').removeClass('plus');
  131.             this.parent('dl').find('.no-more-active').removeClass('no-more-active');
  132.             this.parent('dl').find('.active').removeClass('active').addClass('no-more-active');
  133.             this.addClass('active').next().addClass('active'); 
  134.             this.parent('dl').findActiveSlide();
  135.             if(activeID < noMoreActiveID){
  136.                 this.parent('dl').find('dd.no-more-active').addClass('plus');
  137.             }
  138.             this.parent('dl').calculateSlidePos(); 
  139.         };
  140.    
  141.         jQuery.fn.rotateSlides = function(slideInterval, timerInstance) {
  142.             var accordianInstance = jQuery(this);
  143.             timerInstance.value = setTimeout(function(){accordianInstance.rotateSlides(slideInterval, timerInstance);}, slideInterval);
  144.             jQuery(this).findActiveSlide();
  145.             var totalSlides = jQuery(this).find('dt').size();
  146.             var activeSlide = activeID;
  147.             var newSlide = activeSlide + 1;
  148.             if (newSlide > totalSlides) newSlide = 1;
  149.             jQuery(this).find('dt:eq(' + (newSlide-1) + ')').activateSlide(); // activate the new slide
  150.         }
  151.  
  152.  
  153.         // -------- Let's do it! ------------------------------------------------------------------------------
  154.        
  155.         function trackerObject() {this.value = null}
  156.         var timerInstance = new trackerObject();
  157.        
  158.         jQuery(this).findActiveSlide();
  159.         jQuery(this).calculateSlidePos();
  160.        
  161.         if (settings.autoStart == true){
  162.             var accordianInstance = jQuery(this);
  163.             var interval = parseInt(settings.slideInterval);
  164.             timerInstance.value = setTimeout(function(){
  165.                 accordianInstance.rotateSlides(interval, timerInstance);
  166.                 }, interval);
  167.         }
  168.  
  169.         jQuery(this).find('dt').not('active').click(function(){    
  170.             jQuery(this).activateSlide();
  171.             clearTimeout(timerInstance.value);
  172.         });
  173.                
  174.         if (!(jQuery.browser.msie && jQuery.browser.version == 6.0)){
  175.             jQuery('dt').hover(function(){
  176.                 jQuery(this).addClass('hover');
  177.             }, function(){
  178.                 jQuery(this).removeClass('hover');
  179.             });
  180.         }
  181.     });
  182.     };
  183. })(jQuery);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement