I've built a custom jQuery rotator using just basic animation to rotate the 3 Divs (images). I've built the function and then reinitiate the function using it as a call back. Here's the code:
function ImageRotate() {
var CurrentFeature = "#container" + featureNumber;
$(CurrentFeature).stop(false, true).delay(4500).animate({'top' : '330px'}, 3000);
var featureNumber2 = featureNumber-1;
if ( featureNumber == 1) {featureNumber2=3}
var CurrentFeature2 = "#container" + featureNumber2;
$(CurrentFeature2).stop(false, true).delay(4500).animate({'top' : '0px'}, 3000);
$('#container2').stop(false, true).delay(4500).animate({'top' : '-330px'}, 25);
var featureNumber3 = featureNumber+1;
if ( featureNumber == 3){featureNumber3=1}
var CurrentFeature3 = "#container" + featureNumber3;
$(CurrentFeature3).stop(false, true).delay(7500).animate({'top' : '0px'}, 3000);
$(CurrentFeature2).stop(false, true).delay(4500).animate({'top' : '330px'}, 3000);
$(CurrentFeature).stop(false, true).delay(4500).animate({'top' : '-330px'}, 25);
if (featureNumber ==1) {featureNumber=3} else{featureNumber--};
$(CurrentFeature).stop(false, true).delay(7500).animate({'top' : '0px'}, 3000);
$(CurrentFeature3).stop(false, true).delay(4500).animate({'top' : '330px'}, 3000);
$(CurrentFeature2).stop(false, false).delay(4500).animate({'top' : '-330px'}, 25,ImageRotate());
};
It's worth noting that when calling the function again I also tried making another function called ImageRotate2(); and it did the same thing. It loops, but i get all sorts of funkiness.
Edit: I've also tried some answers in the replies and they both leave me with recursion errors each second.
