是否可以延迟window.load？

Question

I've got this script which shows a message when the user first goes to the website, then it fades out, then another section fades in after a short delay.

$(window).load(function() {
    $(".greeting").delay(1500).fadeOut("500");
    $('.content').delay(2500).animate({opacity: '1'}, 500);
});

HTML/PHP (WordPress)

<div class="greeting">
  <div class="greeting-inner">
  <img id="greeting-img" src="">
  </div>
</div>
<div class="wrap">
  <header class="header">
    <div class="logo">
    <h1><a href="<?php echo home_url(); ?>/"><img src="<?php echo get_stylesheet_directory_uri(); ?>/img/logo.svg" onerror="this.src=<?php echo get_stylesheet_directory_uri(); ?>/img/logo.png;this.onerror=null;" alt="<?php bloginfo('name'); ?>"></a></h1>
    </div>
  </header>
  <nav class="nav">
  <?php wp_nav_menu( array( 
  'theme_location' => 'main-nav',
  'container' => false,
  'items_wrap' => '<ul>%3$s</li>', ) );?>
  </nav>
<section class="content" role="main">
// Website content

Basically I have other scripts which fire when the page has loaded, but the content actually doesn't get shown for 2500ms so everything is 2500ms late. Is there a way to delay the window load so this won't happen?

Answer 1

You can use setTimeout if you are completly sure of the timing:

setTimeout(function() {
   ... 
},"2500");

But It could be better to wait for the script to load, so add a:

$(function(){
 //do stuff
});

on the scripts

Answer 2

No. You cannot delay the window load() , for it is fired by the browser. You would have to set your "other scripts" to be executed after your animate() finishes.

function MyFunction() { //Just an example, of course
    //other scripts
}

$(window).load(function() {
    $(".greeting").delay(1500).fadeOut("500");

    //The last parameter is the callback that is fired after the animation
    $('.content').delay(2500).animate({opacity: '1'}, 500, MyFunction);
});

Answer 3

The window load event executes when the complete page is fully loaded, including all frames, objects and images. So what is the source of the 2500ms exactly? If it is your other scripts doing stuff with the content then all you have to do is call your 2 lines of code above from inside your other scripts, after they are done running.

See here for more info http://4loc.wordpress.com/2009/04/28/documentready-vs-windowload/