/* * easyaccordion 0.1 - jquery plugin * written by andrea cima serniotti * http://www.madeincima.eu * * copyright (c) 2010 andrea cima serniotti (http://www.madeincima.eu) * dual licensed under the mit (mit-license.txt) and gpl (gpl-license.txt) licenses. * built for jquery library http://jquery.com */ (function(jquery) { jquery.fn.easyaccordion = function(options) { var defaults = { slidenum: true, autostart: false, slideinterval: 3000 }; this.each(function() { var settings = jquery.extend(defaults, options); jquery(this).find('dl').addclass('easy-accordion'); // -------- set the variables ------------------------------------------------------------------------------ jquery.fn.setvariables = function() { dlwidth = jquery(this).width(); dlheight = jquery(this).height(); dtwidth = jquery(this).find('dt').outerheight(); if (jquery.browser.msie){ dtwidth = $(this).find('dt').outerwidth();} dtheight = dlheight - (jquery(this).find('dt').outerwidth()-jquery(this).find('dt').width()); slidetotal = jquery(this).find('dt').size(); ddwidth = dlwidth - (dtwidth*slidetotal) - (jquery(this).find('dd').outerwidth(true)-jquery(this).find('dd').width()); ddheight = dlheight - (jquery(this).find('dd').outerheight(true)-jquery(this).find('dd').height()); }; jquery(this).setvariables(); // -------- fix some weird cross-browser issues due to the css rotation ------------------------------------- if (jquery.browser.safari){ var dttop = (dlheight-dtwidth)/2; var dtoffset = -dttop; /* safari and chrome */ } if (jquery.browser.mozilla){ var dttop = dlheight - 20; var dtoffset = - 20; /* ff */ } if (jquery.browser.msie){ var dttop = 0; var dtoffset = 0; /* ie */ } // -------- getting things ready ------------------------------------------------------------------------------ var f = 1; jquery(this).find('dt').each(function(){ jquery(this).css({'width':dtheight,'top':dttop,'margin-left':dtoffset}); if(settings.slidenum == true){ jquery(''+0+f+'').appendto(this); if(jquery.browser.msie){ var slidenumleft = parseint(jquery(this).find('.slide-number').css('left')) - 14; jquery(this).find('.slide-number').css({'left': slidenumleft}) if(jquery.browser.version == 6.0 || jquery.browser.version == 7.0){ jquery(this).find('.slide-number').css({'bottom':'auto'}); } if(jquery.browser.version == 8.0){ var slidenumtop = jquery(this).find('.slide-number').css('bottom'); var slidenumtopval = parseint(slidenumtop) + parseint(jquery(this).css('padding-top')) - 12; jquery(this).find('.slide-number').css({'bottom': slidenumtopval}); } } else { var slidenumtop = jquery(this).find('.slide-number').css('bottom'); var slidenumtopval = parseint(slidenumtop) + parseint(jquery(this).css('padding-top')); jquery(this).find('.slide-number').css({'bottom': slidenumtopval}); } } f = f + 1; }); if(jquery(this).find('.active').size()) { jquery(this).find('.active').next('dd').addclass('active'); } else { jquery(this).find('dt:first').addclass('active').next('dd').addclass('active'); } jquery(this).find('dt:first').css({'left':'0'}).next().css({'left':dtwidth}); jquery(this).find('dd').css({'width':ddwidth,'height':ddheight}); // -------- functions ------------------------------------------------------------------------------ jquery.fn.findactiveslide = function() { var i = 1; this.find('dt').each(function(){ if(jquery(this).hasclass('active')){ activeid = i; // active slide } else if (jquery(this).hasclass('no-more-active')){ nomoreactiveid = i; // no more active slide } i = i + 1; }); }; jquery.fn.calculateslidepos = function() { var u = 2; jquery(this).find('dt').not(':first').each(function(){ var activedtpos = dtwidth*activeid; if(u <= activeid){ var leftdtpos = dtwidth*(u-1); jquery(this).animate({'left': leftdtpos}); if(u < activeid){ // if the item sits to the left of the active element jquery(this).next().css({'left':leftdtpos+dtwidth}); } else{ // if the item is the active one jquery(this).next().animate({'left':activedtpos}); } } else { var rightdtpos = dlwidth-(dtwidth*(slidetotal-u+1)); jquery(this).animate({'left': rightdtpos}); var rightddpos = rightdtpos+dtwidth; jquery(this).next().animate({'left':rightddpos}); } u = u+ 1; }); settimeout( function() { jquery('.easy-accordion').find('dd').not('.active').each(function(){ jquery(this).css({'display':'none'}); }); }, 400); }; jquery.fn.activateslide = function() { this.parent('dl').setvariables(); this.parent('dl').find('dd').css({'display':'block'}); this.parent('dl').find('dd.plus').removeclass('plus'); this.parent('dl').find('.no-more-active').removeclass('no-more-active'); this.parent('dl').find('.active').removeclass('active').addclass('no-more-active'); this.addclass('active').next().addclass('active'); this.parent('dl').findactiveslide(); if(activeid < nomoreactiveid){ this.parent('dl').find('dd.no-more-active').addclass('plus'); } this.parent('dl').calculateslidepos(); }; jquery.fn.rotateslides = function(slideinterval, timerinstance) { var accordianinstance = jquery(this); timerinstance.value = settimeout(function(){accordianinstance.rotateslides(slideinterval, timerinstance);}, slideinterval); jquery(this).findactiveslide(); var totalslides = jquery(this).find('dt').size(); var activeslide = activeid; var newslide = activeslide + 1; if (newslide > totalslides) newslide = 1; jquery(this).find('dt:eq(' + (newslide-1) + ')').activateslide(); // activate the new slide } // -------- let's do it! ------------------------------------------------------------------------------ function trackerobject() {this.value = null} var timerinstance = new trackerobject(); jquery(this).findactiveslide(); jquery(this).calculateslidepos(); if (settings.autostart == true){ var accordianinstance = jquery(this); var interval = parseint(settings.slideinterval); timerinstance.value = settimeout(function(){ accordianinstance.rotateslides(interval, timerinstance); }, interval); } jquery(this).find('dt').not('active').click(function(){ jquery(this).activateslide(); cleartimeout(timerinstance.value); }); if (!(jquery.browser.msie && jquery.browser.version == 6.0)){ jquery('dt').hover(function(){ jquery(this).addclass('hover'); }, function(){ jquery(this).removeclass('hover'); }); } }); }; })(jquery);