views:

399

answers:

2

What is the best way to set up a local fallback image if the external image does not load or takes too long to load.

+1  A: 

Try to make use of the Image.complete property.

var img = new Image(w,h)
img.src = "http://...";

Now check periodically if img.complete is true and call some fallback mechanism shuold it still be false after n seconds.

moxn
+4  A: 

You can add an oneror handler:

<img src="http://example.com/somejpg.jpg"
    onerror='this.onerror = null; this.src="./oops.gif"' />

Note setting onerror to null in the handler so that the browser doesn't die if oops.gif can't be loaded for some reason.

Craig Stuntz
Oh, I forgot about onerror. This might be easier, but the solution I posted below allows to precache the images and check their availability before they have to be displayed. Depends on what you need...
moxn