jQuery animation queue for many elements

Question

I've got a lot of elements that are different somehow (b,c,d,e,f classes), but each of them has something the same - 'a class'. How to make some animation quene that will make them animate one after another in FIFO order (first in, first out)?

Callback's are going crazy with it as there are many elements and I cant estamine what div will be called when.

Please don't post questions which contain nothing useful except a JSFiddle. Not how Stack Overflow works. Your question needs to be self contained and answerable without opening any external links. You can then supplement it with a JSFiddle. — user229044
– user229044 ♦, Commented Mar 28, 2013 at 17:32

Nelson Benítez León · Accepted Answer · 2013-03-28 18:23:31Z

1

Given that your animations are all the same kind(animating left to 50) but done on multiple elements, you can do it this way:

nextAnim( $('.a') );

function nextAnim(elems) {
    elems.eq(0).animate({'left':50}, function() {
             nextAnim( elems.slice(1) );  // slice off the first element
    });
}

See working fiddle

answered Mar 28, 2013 at 18:23

Nelson Benítez León

51.1k8 gold badges70 silver badges84 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 11:57:27Z

0

Understanding jQuery Deferred.pipe()

You can try to use deferred object if you're feeling like learning something new and doing things in an elegant way.

edited May 23, 2017 at 11:57

CommunityBot

11 silver badge

answered Mar 28, 2013 at 18:28

Populus

7,7003 gold badges42 silver badges56 bronze badges

Comments

OPOPO · Accepted Answer · 2013-03-28 19:49:42Z

0

I've used

$('.a').filter(function(){ return $(this).is(':animated')}).length

to know if any of items is alredy animated, and I'm firing animations only when no of them is animating

answered Mar 28, 2013 at 19:49

OPOPO

5032 gold badges5 silver badges16 bronze badges

Collectives™ on Stack Overflow

jQuery animation queue for many elements

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related