Specify the missing image icon

Question

Possible duplicate:
jQuery / javascript to replace broken images

It should be easy, I just don’t know what terminology to look for. I think this is HTML / CSS, if the link to the image is broken, the missing image icon is often displayed showing a page with red, green, blue shapes. In HTML, you can configure "use this image if the link to the image is broken?"

Answer 1

Example "onerror":

<img src="fail.jpg" onerror="this.src='https://www.google.com.br/logos/2012/montessori-res.png';"> 

http://jsfiddle.net/u4hQd/

Answer 2

I think the basis of this is to add dynamic functionality to CSS. I don’t know about if / else checking in CSS other than detecting browsers, however this is what I would do if I ever need to do something like this.

If you are using php you can do this:

 $imagename = "image.png"; if (file_exists($imagename)){ echo '<p class="exists">'; } else { echo '<p class="dne">'; } 

Then in css you can have

 .exists{background:url("../img/git-sprite.png") no-repeat 0px -32px;} .dne{background:url("../img/git-sprite2.png") no-repeat 0px -32px;} 

This way you can add if / else functionality for this in the CSS itself. You do not need to use PHP, I'm sure javascript will work as well

Answer 3

Do you use php?

You can check before sending a file something like this:

 $filename = "whatever.png"; if (file_exists($filename)){ $html = "<img src=\"$filename\">"; } else { $html = "<img src=\"someotherpath.jpg\">"; } echo $html; 

Answer 4

Your question is clear without any additional terminology. Unfortunately, there is no means in HTML for what you want.

What you can do is use JS (jQuery will help), loop through all the img tags in your document and check which ones have images (tick null). For those who skip their images, you can upload another image (default).

But do not forget to run this script after the page is fully loaded (with all assets: JS, CSS, images), because if you run it before the page loads, you may mistakenly put the default image on some img tag that did not have time to load his real image.