Search jQuery

jQuery Forum

Using jQuery

olegef

each iteration and animate

in Using jQuery • 11 years ago

Hello.

I have the following simple code.

$.each(['red','green','blue','black','orange','yellow'], function(index,value) {
$('.all_img').stop().animate({"opacity": "0"}, "slow");
$('#img_' + value).stop().animate({"opacity": "1"}, "slow");
# some delay here
});

Just to show images one after another. But it seems i have some problems with understanding how each() method works. So i see only one image animation instead of 5.

Could you please clarify?
Thanx

Replies(3)

Kevin B

Re: each iteration and animate

11 years ago

you need to add a delay in here some how... try this:

$.each(['red','green','blue','black','orange','yellow'], function(index,value) {
setTimeout(function(){
$('.all_img').stop().animate({"opacity": "0"}, 1000);
$('#img_' + value).stop().animate({"opacity": "1"}, 1000);
},1000*index)
});

the first will have no delay, then every one after will have a delay each increased by 1000.

-- Kevin

olegef

Re: each iteration and animate

11 years ago

Kevin, thank you for answer.

unfortunately it does not work. nothing happens. even if i add alert()

$.each(['red','green','blue','black','orange','yellow'], function(index,value) {
setTimeout(function(){
$('.all_img').stop().animate({"opacity": "0"}, 1000);
$('#img_' + value).stop().animate({"opacity": "1"}, 1000);
alert(index);
},1000*index)
});

jcollas

each iteration and animate

11 years ago

Are you looking for something like this?:

var arr = ['red','green','blue','black','orange','yellow'];
var i = 0;
function engine(){
setTimeout(function(){
alert(arr[i]);
i++;
if( i < arr.length ) engine();
},1000*i)
}
engine();

Top Reply

Response title

Attachments

jQuery Forum

each iteration and animate

Replies(3)

Re: each iteration and animate

Re: each iteration and animate

each iteration and animate

Statistics

Tags

Actions