http://www.echtefriesevlag.nl/js/jquery.easyAccordion.js?20992

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: false, //was true (ET)
16		autoStart: false, //was true (ET)
17		slideInterval: 3000, // interval autoslide
18		slideTime: 500,
19		slideComplete: function() {show_content();} // functie wordt op settings.timer slideTime/100 uitgevoerd
20	};
21			
22	this.each(function() {
23		
24		var settings = jQuery.extend(defaults, options);		
25		jQuery(this).find('dl').addClass('easy-accordion');
26		
27		
28		// -------- Set the variables ------------------------------------------------------------------------------
29		
30		jQuery.fn.setVariables = function() {
31			dlWidth = jQuery(this).width();
32			dlHeight = jQuery(this).height();
33			dtWidth = jQuery(this).find('dt').outerWidth();
34			if (jQuery.browser.msie){ dtWidth = $(this).find('dt').outerWidth();}
35			dtHeight = dlHeight - (jQuery(this).find('dt').outerWidth()-jQuery(this).find('dt').width());
36			slideTotal = jQuery(this).find('dt').size();
37			ddWidth = dlWidth - (dtWidth*slideTotal) - (jQuery(this).find('dd').outerWidth(true)-jQuery(this).find('dd').width());
38			ddHeight = dlHeight - (jQuery(this).find('dd').outerHeight(true)-jQuery(this).find('dd').height());
39		};
40		jQuery(this).setVariables();
41	
42		
43		// -------- Fix some weird cross-browser issues due to the CSS rotation -------------------------------------
44
45		if (jQuery.browser.safari){ var dtTop = (dlHeight-dtWidth)/2; var dtOffset = -dtTop;  /* Safari and Chrome */ }
46		if (jQuery.browser.mozilla){ var dtTop = dlHeight - 20; var dtOffset = - 20; /* FF */ }
47		if (jQuery.browser.msie){ var dtTop = 0; var dtOffset = 0; /* IE */ }
48		
49		
50		// -------- Getting things ready ------------------------------------------------------------------------------
51		
52		var f = 1;
53		jQuery(this).find('dt').each(function(){
54			/*jQuery(this).css({'width':dtHeight,'top':dtTop,'margin-left':dtOffset});	bij rp*/
55			//jQuery(this).css({'width':dtWidth}

55);	
56			if(settings.slideNum == true){
57				jQuery('<span class="slide-number">'+0+f+'</span>').appendTo(this);
58				if(jQuery.browser.msie){	
59					var slideNumLeft = parseInt(jQuery(this).find('.slide-number').css('left')) - 14;
60					jQuery(this).find('.slide-number').css({'left': slideNumLeft})
61					if(jQuery.browser.version == 6.0 || jQuery.browser.version == 7.0){
62						jQuery(this).find('.slide-number').css({'bottom':'auto'});
63					}
64					if(jQuery.browser.version == 8.0){
65					var slideNumTop = jQuery(this).find('.slide-number').css('bottom');
66					var slideNumTopVal = parseInt(slideNumTop) + parseInt(jQuery(this).css('padding-top'))  - 12; 
67					jQuery(this).find('.slide-number').css({'bottom': slideNumTopVal}); 
68					}
69				} else {
70					var slideNumTop = jQuery(this).find('.slide-number').css('bottom');
71					var slideNumTopVal = parseInt(slideNumTop) + parseInt(jQuery(this).css('padding-top')); 
72					jQuery(this).find('.slide-number').css({'bottom': slideNumTopVal}); 
73				}
74			}
75			f = f + 1;
76		});
77		
78		if(jQuery(this).find('.active').size()) { 
79			jQuery(this).find('.active').next('dd').addClass('active');
80		} else {
81			jQuery(this).find('dt:first').addClass('active').next('dd').addClass('active');
82		}
83		
84		jQuery(this).find('dt:first').css({'left':'0'}).next().css({'left':dtWidth});
85		jQuery(this).find('dd').css({'width':ddWidth,'height':ddHeight});	
86
87		
88		// -------- Functions ------------------------------------------------------------------------------
89		
90		jQuery.fn.findActiveSlide = function() {
91				var i = 1;
92				this.find('dt').each(function(){
93				if(jQuery(this).hasClass('active')){
94					activeID = i; // Active slide
95				} else if (jQuery(this).hasClass('no-more-active')){
96					noMoreActiveID = i; // No more active slide
97				}
98				i = i + 1;
99			});
100		};
101			
102		jQuery.fn.calculateSlidePos = function() {
103			var u = 2;
104			jQuery(this).find('dt').not(':first').each(function(){	
105				var activeDtPos = dtWidth*activeID;
106				if(u <= activeID){
107					var leftDtPos = dtWidth*(u-1);
108					jQuery(this).animate({'left': leftDtPos},settings.slideTime, slideCompleteCall() );
109					if(u < activeID){ // If the item sits to the left of the active element
110						jQuery(this).next().css({'left':leftDtPos+dtWidth});	
111					} else{ // If the item is the active one
112						jQuery(this).next().animate({'left':activeDtPos},settings.slideTime, slideCompleteCall() );
113					}
114				} else {
115					var rightDtPos = dlWidth-(dtWidth*(slideTotal-u+1));
116					jQuery(this).animate({'left': rightDtPos},settings.slideTime, slideCompleteCall() );
117					var rightDdPos = rightDtPos+dtWidth;
118					jQuery(this).next().animate({'left':rightDdPos},settings.slideTime, slideCompleteCall() );	
119				}
120				u = u+ 1;
121			});
122			setTimeout( function() {
123				jQuery('.easy-accordion').find('dd').not('.active').each(function(){ 
124					jQuery(this).css({'display':'none'});
125				});
126			}, 400);
127			
128		};
129	
130		jQuery.fn.activateSlide = function() {
131			this.parent('dl').setVariables();	
132			this.parent('dl').find('dd').css({'display':'block'});
133			this.parent('dl').find('dd.plus').removeClass('plus');
134			this.parent('dl').find('.no-more-active').removeClass('no-more-active');
135			this.parent('dl').find('.active').removeClass('active').addClass('no-more-active');
136			this.addClass('active').next().addClass('active');	
137			this.parent('dl').findActiveSlide();
138			if(typeof(noMoreActiveID) != 'undefined' && activeID < noMoreActiveID){
139				this.parent('dl').find('dd.no-more-active').addClass('plus');
140			}
141			this.parent('dl').calculateSlidePos();	
142		};
143	
144		jQuery.fn.rotateSlides = function(slideInterval, timerInstance) {
145			var accordianInstance = jQuery(this);
146			timerInstance.value = setTimeout(function(){accordianInstance.rotateSlides(slideInterval, timerInstance);}, slideInterval);
147			jQuery(this).findActiveSlide();
148			var totalSlides = jQuery(this).find('dt').size();
149			var activeSlide = activeID;
150			var newSlide = activeSlide + 1;
151			if (newSlide > totalSlides) newSlide = 1;
152			jQuery(this).find('dt:eq(' + (newSlide-1) + ')').activateSlide(); // activate the new slide
153		}
154
155
156		// -------- Let's do it! ------------------------------------------------------------------------------
157		
158		function trackerObject() {this.value = null}
159		var timerInstance = new trackerObject();
160
161		function slideCompleteCall() {

162			if (typeof(settings.timer != 'undefined')) { clearTimeout(settings.timer); }
163			settings.timer = setTimeout(settings.slideComplete,settings.slideTime);
164		}
165		
166		jQuery(this).findActiveSlide();
167		jQuery(this).calculateSlidePos();
168		
169		if (settings.autoStart == true){
170			var accordianInstance = jQuery(this);
171			var interval = parseInt(settings.slideInterval);
172			timerInstance.value = setTimeout(function(){
173				accordianInstance.rotateSlides(interval, timerInstance);
174				}, interval);
175		} 
176
177		jQuery(this).find('dt').not('active').click(function(){		
178			jQuery(this).activateSlide();
179			clearTimeout(timerInstance.value);
180		});	
181				
182		if (!(jQuery.browser.msie && jQuery.browser.version == 6.0)){ 
183			jQuery('dt').hover(function(){
184				jQuery(this).addClass('hover');
185			}, function(){
186				jQuery(this).removeClass('hover');
187			});
188		}
189	});
190	};
191})(jQuery);