• posted 8½ months ago
  • 1 comment

IE7 and IE8 image onload events

I've got some pretty straight-forward, simple code which sets the src of an image object. It works great among normal browsers (eg. Chrome, FF, Safari, IE9) but Internet Explorer 7 and 8 give me a hard time.

Specifically, the onload event doesn't fire. At all. Here's the work around I found:
var preload = (new Image()),
    path = 'http://server.com/bla.jpg';
preload.src = path + '?' + Math.random();
preload.onload = function() {
    alert('w00t');
};

I don't know the logic behind it. If I were to guess, I'd say that after the first time, it gets loaded into IE's memory and therefore gets loaded from there rather than the path specified, bypassing the load event (since it wasn't technically loaded?). I dunno. Either way, above definitely solves my issues.

Without the above code and randomization, callbacks would fire after a cache-clear, but not before or after more-than-one load. Bah.

Comments (add comment)

 
  • reply
    Mick

    Mick 6 months ago

    HI, I recently run into same problem when trying to make loading progress bar for a site.
    It looks like IE8 and below doesn't fire onload events on images, if they are also linked in CSS. However it does fire onload if images are linked in HTML or loaded via JS.
    Unfortunately your solution was unacceptable in my case, because it forces browsers to download all images twice, first via JS and then from CSS (I checked server logs). Only Chrome is smart enough to get 304 not modified response, but it still is not a solution.