/*
"class" : Div Rotate (works on anything with any class or element in theory, for EXISTING elements on the page)
author : oakley
version : beta2
usage : set the selector variable below, along with transitionDelay and transitionLength to customize.  All divs that you are rotating must be position absolute over the top of each other for optimal results.
summary : each instance of the selector is stored in an array and set to display none ( make sure the elements are where you want them ).  On slow servers you may need to set display none for your selector in your stylesheet.  It then iterates over each item in this new array and fades from one to another, looping back to the first item when done.
*/

// Customizable variables
var selector = ".rotatingImage";
var transitionDelay = 6000;
var transitionLength = 1000;

// Do no modify anything below this point unless necessary
var elements = new Array();
var i = 0;
var pos = 0;

jQuery(document).ready( function() {
    jQuery(selector).each( function( index ) {
            elements[i] = this;
            jQuery(this).css("display","none");
            i++;
    });

    jQuery(elements[0]).css("display","block");
    rotateDiv(elements);
    setInterval( function() { rotateDiv(); }, transitionDelay);
});

function rotateDiv( )
{
    fadeOut = pos % elements.length;
    fadeIn = ( pos % elements.length + 1 > elements.length-1 ) ? 0 : pos % elements.length + 1;

    setTimeout( "jQuery(elements[" + fadeOut + "]).fadeOut(" + transitionLength + ")", transitionDelay);
    setTimeout( "jQuery(elements[" + fadeIn + "]).fadeIn(" + transitionLength + ")", transitionDelay);

    pos++;
}