If image is not found on server, show alternative

**amygdela** · 04-24-2006, 09:14 AM

Hi!

I'm looking for some help on a code. For a client I have to create a little script that searches for images on a webpage and if the image is not found, show an alternative one.

I think i can manage it in PHP, but since it's a .jsp page, I cannot use PHP! Can anybody point me in the right direction what to do here?

Any help is appreciated,

amygdela

**rck** · 04-27-2006, 04:10 AM

Actually, you might be able to do that by using CSS alone. For example using the Image Preloader technique. Instead of the animation mentioned there, you could go for a simple, gray graphics. That way, the graphics would prevail if the primary image is not available.

**amygdela** · 04-27-2006, 06:34 AM

thanks, but I've found a js solution:

Code:

<html> 
<head> 
<script type="text/javascript"> 
  function fixBrokenImages(){ 
    // alle afbeeldingen uit tussen de body tags 
    var imglst = document.images; 
    for(var i = 0; i < imglst.length; i++){ 
      imglst[i].onerror = function() { 
        // weergeven als er een fout is opgetreden 
        this.src = "http://www.centcom.mil/_layouts/images/ERROR.GIF"; 
      } 
      // afbeelding refreshen omdat de onerror  
      // pas achteraf wordt ingesteld. 
      imglst[i].src = imglst[i].src; 
    } 
  } 
</script> 
</head> 
<body onload="fixBrokenImages();"> 
<img src="http://www.bonideproducts.com/images/checked.gif" /> 
<img src="http://www.bonideproducts.com/images/cheked.gif" /> <!-- FOUTIEVE URL --> 
<img src="http://www.bonideproducts.com/images/checked.gif" /> 
<img src="http://www.bonideproducts.com/images/checked.gif" /> 
</body> 
</html>