Thursday, May 23, 2024
 Popular · Latest · Hot · Upcoming
43
rated 0 times [  50] [ 7]  / answers: 1 / hits: 96247  / 14 Years ago, tue, july 13, 2010, 12:00:00

Do you know how to hide the classic “Image not found” icon from a rendered HTML page when an image file is not found?



Any working method using JavaScript/jQuery/CSS?


More From » jquery

 Answers
8

You can use the onerror event in JavaScript to act when an image fails to load:



var img = document.getElementById(myImg);
img.onerror = function () {
this.style.display = none;
}


In jQuery (since you asked):



$(#myImg).error(function () { 
$(this).hide();
});


Or for all images:



$(img).error(function () { 
$(this).hide();
// or $(this).css({visibility:hidden});
});


You should use visibility: hidden instead of .hide() if hiding the images might change the layout. Many sites on the web use a default no image image instead, pointing the src attribute to that image when the specified image location is unavailable.


[#96250] Saturday, July 10, 2010, 14 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
erick

Total Points: 588
Total Questions: 92
Total Answers: 100

Location: Bangladesh
Member since Sat, Jan 23, 2021
3 Years ago
erick questions
;