Home > Software development, javascript > Safari window.onload timing issue

Safari window.onload timing issue

I ran into some Safari related timing issues at work, that I thought were worthy of a post.  To preface the post I’m using the dojo framework.  On to the post…

I needed to position a flash overlay relative to the absolute postion of a div that will vary in position on subsequent page loads.  So in comes the handy dojo.coords(id) function wrapped in a dojo.addOnLoad.  This works like a charm in firefox 3, ie 6, ie7 and google chrome.  In safari, no dice.  The offsetTop and offsetLeft calculations were completely off (I tried this with my own custom function as well as dojo.coords())  I was finally able to get this to work with using a setTimeout delay (hack).

After researching the issue it seems apple decided to make window.onload fire “before” the page loads.  (Seems counterintuitive to me, but it’s no wonder it’s so fast in benchmarks)  This explains the miscalculation of element positioning on the page.  Waiting for the page to load with a timeout fixes the problem.  The solution is a hack and is obviously not fool proof as in there is no real barrier to execution.  Does anyone in the interweb out there know how to get Safari to fire onload as in when the page actually finishes loading?  Knock knock.

  1. March 14th, 2011 at 11:31 | #1

    You may have already found a solution, or there may be some reason this wouldn’t work for you, but as an alternative to the timeout, you might be able to force Safari’s JavaScript execution to pause your function until layout is complete by inserting a call to document.body.offsetWidth prior to your other calculations.

    I can’t remember where I first encountered this tip, but there’s a description of it here: http://www.howtocreate.co.uk/safaribenchmarks.html

  2. March 16th, 2011 at 02:16 | #2

    Ah interesting. This was so long ago I don’t fully remember the overlay or campaign I was working on at Estee Lauder. It was all a blur.

  3. March 24th, 2015 at 22:48 | #3

    Good call, Samuel! Can’t believe I misesd that. It definitely should call setInterval instead of setTimeout otherwise it will just run that single time and not keep calling keepSessionAlive again.

  4. September 14th, 2015 at 15:10 | #4

    This is the perfect post for me to find at this time

  5. September 14th, 2015 at 15:11 | #5

    You got to push it-this essential info that is!

  6. October 10th, 2015 at 07:37 | #6

    To think, I was confused a minute ago.

  7. October 25th, 2015 at 20:56 | #7

    Hats off to whoever wrote this up and posted it.

  8. November 27th, 2015 at 11:22 | #8

    This is the perfect way to break down this information.

  9. January 15th, 2016 at 09:54 | #9

    Ah yes, nicely put, everyone.

  1. No trackbacks yet.