Home/ Questions/Q 786065
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-14T20:58:44+00:00

what is wrong in this code? I’m trying to get this effect: fadeOut(500) and

  • 0

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! :'( 

$('#myDiv').fadeOut(500)
           .delay(600)
           .attr('class','myClass')
           .delay(600)
           .fadeIn(500);
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    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:

    $('#myDiv').fadeOut(500)
           .delay(600)
           .queue(function(next) { $(this).attr('class','myClass'); next(); })
           .delay(600)
           .fadeIn(500);

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

    • 0