SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,122
    Mentioned
    29 Post(s)
    Tagged
    2 Thread(s)

    init on load event

    Hi,

    Do you find that waiting for the entire page to load is too long to intialise the page with javascript?
    I'm always too eager and click things before they have been setup.

    How do you get around this?

  2. #2
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Yes, this is a problem, often when you want to have things initially hidden so that you can make them appear upon some event. This means that display:none must be applied onload with JS to the element you want hidden initially, so that it can be seen when JS is off.

    The only unobtrusive way around this is this: http://dean.edwards.name/weblog/2006/06/again/

    There still might be a flicker or delay depending on what you're doing, because CSS is applied even as the DOM is being constructed and the method linked to kicks in only when the DOM tree has been finished.

    Otherwise you have to resort to putting javascript straight into the body which isn't a brilliant idea.

  3. #3
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,122
    Mentioned
    29 Post(s)
    Tagged
    2 Thread(s)
    Thanks Raffles

  4. #4
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    In Simply JavaScript, Kevin Yank and Cameron Adams describe how you can add an event listener for the DOMContentLoaded event instead of the normal load event.

    This means you don't have to wait until all external resources (like CSS files) have been fully loaded. It's only supported by some modern browsers, though, and not by IE.

    The book shows a working way to have the cake and eat it, too. You add an event listener for both events and make sure that the initialisation is executed only once. Browsers that support DOMContentLoaded will provide a snappier response, while the others fall back on the trusted old load event.
    Birnam wood is come to Dunsinane

  5. #5
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,122
    Mentioned
    29 Post(s)
    Tagged
    2 Thread(s)
    Great, I skimmed over that in the Appendix.. Thanks.

  6. #6
    SitePoint Enthusiast szigeti's Avatar
    Join Date
    May 2005
    Location
    Hungary
    Posts
    70
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AutisticCuckoo View Post
    Browsers that support DOMContentLoaded will provide a snappier response, while the others fall back on the trusted old load event.
    Here is a cross-browser solution for implementing DOMContentLoaded: http://www.thefutureoftheweb.com/blog/adddomloadevent

    And by the way, what's wrong with this "poor man's domcontentloaded" solution?
    Code:
    ...
    <script type="text/javascript">
    init();
    </script>
    </body>
    </html>
    Eat healthy,
    Exercise daily,
    Die anyway.

  7. #7
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    It's ugly.

  8. #8
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by szigeti View Post
    And by the way, what's wrong with this "poor man's domcontentloaded" solution?
    Nothing, really, but sometimes you don't have access to the whole code. If you're using a CMS or some other templated system, you may not have the option of adding code just before </body>.
    Birnam wood is come to Dunsinane


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •