Posted By

fredaudet on 08/05/08

Tagged

Versions (?)

Last Edited at 08/05/08 02:46pm

Statistics

Viewed 510 times

Favorited by 1 user(s)

Related snippets

Mootools news rotate

/ Published in: HTML

http://mcarthurgfx.com/blog/javascript/rotater-class/

This does required the Fx.Elements add-on on top of the regular Mootools framework, so be sure to grab the extra classes from Mootools More.

Highlighted TextExpand

window.addEvent('domready',fuction(){
	var rotater = new Rotater('.slide',{ //Class of elements that should rotate.
		slideInterval:4000, //Length of showing each element, in milliseconds
		transitionDuration:1000, //Length crossfading transition, in milliseconds
	});
});

var Rotater=new Class({Implements:[Options,Events],options:{slideInterval:4000,transitionDuration:1000,startIndex:0,autoplay:true},initialize:function(B,A){this.setOptions(A);this.slides=$$(B);this.createFx();this.showSlide(this.options.startIndex);if(this.slides.length<2){this.options.autoplay=false}if(this.options.autoplay){this.autoplay()}return this},toElement:function(){return this.container},createFx:function(){if(!this.slideFx){this.slideFx=new Fx.Elements(this.slides,{duration:this.options.transitionDuration})}this.slides.each(function(A){A.setStyle("opacity",0)})},showSlide:function(B){var A={};this.slides.each(function(C,D){if(D==B&&D!=this.currentSlide){A[D.toString()]={opacity:1}}else{A[D.toString()]={opacity:0,}}},this);this.fireEvent("onShowSlide",B);this.currentSlide=B;this.slideFx.start(A);return this},autoplay:function(){this.slideshowInt=this.rotate.periodical(this.options.slideInterval,this);this.fireEvent("onAutoPlay");return this},stop:function(){$clear(this.slideshowInt);this.fireEvent("onStop");return this},rotate:function(){current=this.currentSlide;next=(current+1>=this.slides.length)?0:current+1;this.showSlide(next);this.fireEvent("onRotate",next);return this}});

Report this snippet Tweet

Comments

Subscribe to comments

Comment:

You need to login to post a comment.