Question

I am relatively new to jQuery so this may be a beginners mistake, but for some reason I can’t get the .delay() function to work.

The code I am working with is:

$(document).ready(function() {                     
    $("div#main").css("opacity","0");  
    $("div#main").animate({opacity: 1}.delay(1000), 'slow');  
});

With the “jQuery 1.2.3 – New Wave Javascript” script

Can anyone point out what I am doing wrong? Thanks in advance!

Answer 1

I see two problems. One is that there is no delay function in jQuery 1.2.3. You’ll either need to include it as a plugin or update to the most recent version of jQuery. Assuming that you’ve done this, the other problem is that you’re calling delay on a normal JavaScript object, and not a jQuery object. You should be getting an error from trying to call a non-existent function. So instead of this:

$("div#main").animate({opacity: 1}.delay(1000), 'slow');

Use this:

$("div#main").delay(1000).animate({opacity: 1}, 'slow');

This inserts a one second delay in the animation queue that will be executed before the opacity animation is triggered.