How to hide image broken Icon using only CSS/HTML?


<img src="Error.src" onerror="this.style.display='none'"/>

or
<img src="Error.src" onerror="this.src='fallback-img.jpg'"/>

 

document.addEventListener("DOMContentLoaded", function(event) {
   document.querySelectorAll('img').forEach(function(img){
  	img.onerror = function(){this.style.display='none';};
   })
});

<img src="error.src">
<img src="error.src">
<img src="error.src">
<img src="error.src">


Reference:
https://stackoverflow.com/questions/22051573/how-to-hide-image-broken-icon-using-only-css-html
 


Article ID: 40
Created On: Wed, Sep 30, 2020 at 5:45 AM
Last Updated On: Wed, Sep 30, 2020 at 5:45 AM
Authored by: Saeed Nobakht [[email protected]]

Online URL: https://www.navel.ir/article/how-to-hide-image-broken-icon-using-only-css-html-40.html