I’ve already found a solution using {queue: true}, but the problem is that this doesn’t seem to work in my case.
I’ve created a fiddle to help you understand my problem: http://jsfiddle.net/c6SS9/1/.
jQuery Code:
$(function() {
for(var i=0; i < $('.block').size(); i++) {
$('.block').eq(i).delay(i*200).animate({'left': '300px'}, 700);
$('.block').eq(i).delay(i*200).animate({'opacity': '1'}, {queue: false, duration: 1000});
}
});
What i want is that the animation used for the opacity starts when the block start to move and this has to happen for each block.
I guess you understand the problem is that the
opacityanimation bypasses delay as it is not on the queue.In this case, use the generic
.queue()function to add the animations AFTER the delay, so that they are executed after the delay even if they are not on the queueUpdated fiddle