Reputation: 393
setTimeout doesn't work as expected because it will execute the codes below subsequently without waiting for the delay to run the first argument of 'setTimeout'
(function() {
var a = ['#bird','#flower','#cat'];
var totalno = settings.imageArray.length;
function rotateImages(start) {
var nextImage = start + 1;
if(nextImage % totalno == 0){
nextImage=0;
}
//do animate here
$(settings.imageArray).fadeOut();
window.setTimeout(function() {
rotateImages(++start % totalno);
}, settings.imageArray[start].delay);
}
rotateImages(0);
})();
Is there a way to write it so that it doesnt fade out right away for the first image?
a simplified version would be :
(function() {
var a = ['#bird','#flower','#cat'];
function rotateImages(start) {
//do something here
window.setTimeout(function() {
rotateImages(++start % a.length;);
}, 1000);
}
rotateImages(0);
})();
Upvotes: 0
Views: 568
Reputation: 238296
it will execute the codes below subsequently without waiting for the delay to run the first argument of 'setTimeout'
It looks like you're starting the first rotate directly. Instead of:
rotateImages(0);
Try to start the first rotate with a delay, like:
window.setTimeout(function() {
rotateImages(0);
}, settings.imageArray[0].delay);
Upvotes: 1