Comments on: A Fix for Missing or Broken Images

By: Bill Scheurer

Bill Scheurer — Sun, 07 Aug 2011 16:00:40 +0000

Jonathan, you are a ninja master! I struggled many hours with this, looking at other code very similar to yours. The key with your code is passing the “(source)” object (I assume it could be called anything?), clearing the onerror, and returning true. That made all the difference! Ferris Buehler, you’re my hero.

By: rupali

rupali — Fri, 05 Aug 2011 12:14:44 +0000

thank you very much this is great

By: Albert

Albert — Mon, 20 Jun 2011 19:50:45 +0000

what I was looking just perfect Thanks!

By: A simple solution for “image not available” problem « a non-geek's blog

Thu, 29 Apr 2010 09:31:32 +0000

[...] leave a comment » Is there a simple solution for problems with missing or broken images? Yes, it is. You don’t need any script, just an alternate image to display when this problem occur and the “onerror” event available with the img element. Here is an example: < img src="/path/to/image.jpg" height="100px" width="100px" onerror="this.src = '/path/to/alternate-image.png'" / > This simple solution was posted by Satya on his web scripting blog. Anyway, if you preffer a more elegant solution, you could use a script that dynamically detects the missing images and replace them with an alternate image. A good Java Script solution is presented on the tech evangelisit’s article. [...]

By: Phill

Phill — Mon, 15 Feb 2010 15:17:28 +0000

It definitely doesn’t work in Safari 4.04

By: FLASH

FLASH — Tue, 06 Oct 2009 09:53:59 +0000

I found this method, might more simple

onError=”this.src=images/no-image-100px.gif”

By: Doogie

Doogie — Wed, 08 Jul 2009 13:05:57 +0000

Hi Mike

That would be necessary if your image directory is not just level below the root directory, but is below a subdirectory containing the script being executed. However, if the images directory is off the root directory and your script is in the root directory, it should not matter.

The reason that the script is written to be “root relative” is so that the script can be used universally throughout a site, regardless of which directory the scripts are running from.

Whatever worked for your situation is what is important.

By: Mike

Mike — Tue, 07 Jul 2009 01:26:34 +0000

Hi, I just had to make 1 little change.. removed first forward slash “/” like src=”images/ NOT src=”/images/ in java script too.

function onImgErrorSmall(source)
{
source.src = “images/no-image-100px.gif”;
// disable onerror to prevent endless loop
source.onerror = “”;
return true;
}

By: Online Poker Tutor

Online Poker Tutor — Thu, 23 Apr 2009 21:58:31 +0000

Works perfectly.. thanks for the script and information on how to use it.

Tested in FF3, IE8 and Chrome

By: Doogie

Doogie — Mon, 20 Apr 2009 22:05:07 +0000

It was written long before Chrome was developed. However, I just checked it in Chrome and it is working fine on my sites.

If it isn’t working on your site, you may have a JavaScript typo or you could be running a beta copy of Chrome. Make sure that your version of Chrome is current.