Panoramio's Blog


onload event

September 18th, 2005 by JoaquĆ­n Cuenca Abela

You can use the onload event on images to know when the browser has finished the download of an image.

I have used it for the upcoming version of Panoramio, where I only show the images after they have been fully loaded.

There is however a subtle difference between Internet Explorer and Firefox related to this event.

If you set up the handler to this event after setting the src of the image and the image is in the cache, Internet Explorer will not fire the onload event.

Internet Explorer fires this event inmediatelly if the image is in the cache, so you should do:


img.onload = onLoadHandler;
img.src = "foo.png";

instead of


img.src = "foo.png";
img.onload = onLoadHandler;

or your code will not work on Internet Explorer for cached images.


6 Responses to “onload event”  

  1. 1 John Zeratsky

    This totally saved me. Thank you.

  2. 2 Sales Configurator

    Thanks! Great post!

  3. 3 u24

    I have been tearing my hair out for two nights because of this bug. Thankyou SO much. Check out what I’ve been working on here: http://puremango.co.uk/mask/
    I’ve given you credit in the code. thanks again.

  4. 4 Edward Bareew

    Thank you!
    Excellent decision? it very helps me!

  5. 5 Sim

    How to put the progress bar while loading markers in the google map?
    thx

  6. 6 JimBob

    Almost good enough…
    What if I cant set the handler before setting the src?
    Is there a property like ‘isLoaded’ or something to figure out if the image has already loaded?

Leave a Reply


For spam detection purposes, please copy the number 3164 to the field below: