PSD to HTML conversion PSD to HTML conversion PSD2HTML.com with over 300 professionals takes the designs to HTML and beyond

Code Snippet

Home » Code Snippets » jQuery » Run JavaScript Only After Entire Page Has Loaded

Run JavaScript Only After Entire Page Has Loaded

$(window).bind("load", function() {
   // code here
});

Subscribe to The Thread

  1. Baylor Rae'

    This should go in jQuery

    Reply ↓
  2. Rory McCrossan

    A shorthand version of this is:

    $(function() {
    // code here
    }

    Reply ↓
    • Chris Coyier

      There is a fundamental difference there. That is is when the DOM is ready, which is usually ideal. This is when the whole page has finished loading, which is different. For example, this will wait for images to be finished loading, so that you can measure their widths and heights accurately while your snippet will not wait. Small but sometimes crucial difference.

    • test

      $(function() {
      // code here
      }

  3. Rodrigo

    This is probably my first comment on your site and I’ve been a fan and reading for a long while probably since podcast 20 XD

    I haven’t been able to figure out where to place this code..?

    If you can help me out, give me an example with your “simple jquery accordion” – http://css-tricks.com/snippets/jquery/simple-jquery-accordion/

    Thanks, Chris!

    Reply ↓
    • Mike Smith

      Place the code in your <head>HERE</head> section.

    • Artur Ejsmont

      it depends how much code you have and if you are erver going to reuse. If you want to reuse put function in the JS file with reference to a variable that lives in

      Then you can put any id you want per page and if item of this id exists it will be processed.

      so in JS file you dont hardcode stuff that much just check if varialbe is ther and what is the value.

      for this example i guess it would be an overkill

      :- )

  4. ChromA

    Is there way to do this without jQuery? I use jQuery (but the script will be loaded at page-end). I’m looking for a JS-Snippet to use in the Content (that will be executed when the page has loaded.

    Reply ↓
  5. mathew

    Small thing. When using the button “copy to clipboard” it will copy it with curly ‘”‘ and not just straight “. With the curly ones the code doesn’t work…

    Thanks

    Reply ↓
  6. jon

    // just another way to write the same thing.

    $(window).load(function() {
    // everything’s finished loaded code here…
    });

    Reply ↓
  7. Ahxan Khan

    how can i add this to blogger template??

    Reply ↓

Speak, my friend

At this moment, you have an awesome opportunity* to be the person your mother always wanted you to be: kind, helpful, and smart. Do that, and we'll give you a big ol' gold star for the day (literally).

Posting tips:
  • You can use basic HTML
  • When posting code, please turn all
    < characters into &lt;
  • If the code is multi-line, use
    <pre><code></code></pre>
Thank you,
~ The Management ~