How To Prevent The Display Of Image Placeholder If The Image Is Not Found?
Is there a way to not display the image placeholder if the image was not found? I've got images loaded by automatic feed, and for some items images are there, but for some there ar
Solution 1:
I found an answer here
This piece of code works great!
functiononImgErrorSmall(source)
{
source.src = "/images/no-image-100px.gif";
// disable onerror to prevent endless loop
source.onerror = "";
returntrue;
}
And then call it like this:
<imgsrc="/images/19013_small.jpg"alt=""onerror="onImgErrorSmall(this)" />
Solution 2:
try this:
var tester=newImage()
tester.onload=function() {createPlaceHolderForImage(); }
tester.onerror=function() {handleError(); }
tester.src="http://www.temp.com/image.jpg"
onload function gets called if the image exists, otherwise handleError is called
Solution 3:
Here is a sample using jQuery, this could also be done in JavaScript:
<scripttype="text/javascript">
$(document).ready(function(){
$("img").each(function(){
var imgObj = $(this);
var img = newImage();
img.onerror=function(){ imgObj.attr('src','placeholder.gif'); }
img.src = imgObj.attr('src');
});
});
</script><ul><li><imgsrc="blah.gif" /></li><li><imgsrc="blah.png" /></li><li><imgsrc="http://www.google.com/intl/en_com/images/srpr/logo2w.png" /></li></ul>
This code will go through each image and check if it exists. If it doesn't exist then it is replaced with the 'placeholder.gif' image.
Post a Comment for "How To Prevent The Display Of Image Placeholder If The Image Is Not Found?"