Take the 2-minute tour ×

what is wrong in this code? I'm trying to get this effect: fadeOut(500) and attr('class','myClass') delayed by 600 millisecs.. then delay(600) again, and fadeIn(500). The delays happen correctly but the attr() is not being delayed, it fires when #myDiv is still fading! :'(

share|improve this question

1 Answer 1

up vote 16 down vote accepted

The .delay() only affects the animation or fx queue (unless you specify a different queue specifically). Keep in mind that chaining and queuing are 2 distinctly different concepts, chaining continues the use of the same jquery set, but that's a different thing entirely than any event queues on elements in that set.

To have the .attr() call affected, you have to add it as a callback to that same queue using .queue(), like this:

           .queue(function(next) { $(this).attr('class','myClass'); next(); })

Also note there are .addClass(), .removeClass() and .toggleClass() methods available that may make this a bit cleaner :)

share|improve this answer
I think you should call $(this).dequeue() inside the function. From the docs: Note that when adding a function with .queue(), we should ensure that .dequeue() is eventually called so that the next function in line executes. Anyway +1 ;) –  Felix Kling May 10 '10 at 23:38
@Felix - Woops I'm usually calling this as the last item in the queue, good catch :) –  Nick Craver May 10 '10 at 23:41
Hi Nick, thanks a lot for your answer. It works as you say, however the following calls in queue don't work anymore.. :( EDIT saw only now Felix comment.. thanks a lot to both of you guys –  Luca May 10 '10 at 23:43
@luca - Make sure you're trying the latest answer...that's the thing Felix pointed out in comments, it should work now :) –  Nick Craver May 10 '10 at 23:44
thank you for posting this question it help me fix my problem –  chrishough Apr 12 '12 at 17:38

Your Answer


