How to add pause between each iteration of jQuery .each()?
If you make a method that calls itself every 500 ms that should do that trick. The following code should work.
var __OBJECTS = [];
$('#gameboard .card').each(function() {
__OBJECTS.push($(this));
});
addPositioningClasses();
function addPositioningClasses() {
var $card = __OBJECTS.pop();
$card.addClass('position');
if (__OBJECTS.length) {
setTimeout(addPositioningClasses, 500)
}
}
Tested on fiddle : http://jsfiddle.net/jomanlk/haGfU/
Sorry for digging up an old thread, but this tip could be useful for similar issues:
$cards.each(function(index) {
$(this).delay(500*index).addClass('position');
});
I added this as a comment but now that I have read it correctly and answered my own question this would probably work:
function positionCards() {
var $cards = $('#gameboard .card');
var time = 500;
$cards.each(function() {
setTimeout( function(){ addPositioningClass($(this)); }, time)
time += 500;
});
}