Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Feb 2008
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts

    window.onload vrs <body onload="">

    Hi,

    I have a div element that contains some text. I need to know the height of this text before the page is displayed and I'm trying to find the quickest method possible.

    1. Is body onload faster then using window.onload?
    2. Do these events get executed before any of the page is displayed?
    3. Can you use body onload in a external javascript file instead of in the <body> tag?

    The reason I'm wondering is I don't want the elements to 'flicker' on the page after I set style properties using javascript. The page should display properly immediately without any changes.

    Thanks
    Last edited by Chris_S; 03-16-2009 at 11:13 AM.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,734
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    Quote Originally Posted by Chris_S View Post
    1. Is body onload faster then using window.onload?
    2. Do these events get executed before any of the page is displayed?
    3. Can you use body onload in a external javascript file instead of in the <body> tag?

    1) I would have thought there was no difference.
    2) No. onload means execute after loading has completed.
    3) No. body onload can only be used in the <body> tag. You can use window.onload anywhere but of course multiple onload statements will fail.


    See: - http://www.javascriptkit.com/javatut...iplejava.shtml


    You can get the <div> height as follows, but of course the <div> must exist when the script runs:-

    <script type="text/javascript">
    function getMyDivHeight() {
    var boxHeight = document.getElementById("mydiv").clientHeight;
    alert(boxHeight);
    }
    </script>

    “What is a cynic? A man who knows the price of everything and the value of nothing.” - Oscar Wilde (Irish Poet, Novelist, Dramatist and Critic, 1854-1900)
    Last edited by Philip M; 03-16-2009 at 12:05 PM.

  • #3
    New Coder
    Join Date
    Feb 2008
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yea I didn't think there was any difference, was just making sure.

    This is the way I have my page setup so far. Is this a good way or is there a better/faster solution?

    1. The body is hidden in the external css
    2. window.onload
    3. get height of div using document.getElementById('txt').offsetHeight
    4. once height is found I unhide the body.

    I see you used clientHeight...gotta look into that property.


    I dunno I would rather get the size of the div before it gets loaded. hmm is this even possible?

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,734
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    Quote Originally Posted by Chris_S View Post
    I see you used clientHeight...gotta look into that property.
    For difference between offsetHeight and clientHeight see:-
    http://msdn.microsoft.com/en-us/libr...63(VS.85).aspx

    Quote Originally Posted by Chris_S View Post
    I dunno I would rather get the size of the div before it gets loaded. hmm is this even possible?

    It is as possible as to make yourself rise up from the ground by pulling on your hair.

  • #5
    Regular Coder
    Join Date
    Dec 2008
    Location
    Tannhäuser Gate
    Posts
    286
    Thanks
    7
    Thanked 58 Times in 57 Posts
    You can script ONLOAD for IMG and SCRIPT tags, so for the fastest possible way to get that DIV size, you could include a SCRIPT or IMG [1x1px I suppose] just after the DIV, and use ONLOAD on any of those tags to check DIV size. That way you can get the size right after DIV loads and don't have to wait for the rest of the document.


  •  

    Posting Permissions

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