Catch the unknown image in the <img> tag and set the default image

I have this image tag:

<img id="viewerofinstore" src="{{filteredArray[imageIndex]}}" onError="this.style.visibility = 'hidden'" onload="this.style.visibility = 'visible'" width="297px" height="297px" /> 

src images change every second with a different image, but there are some cases where the image is worn and an unknown image appears.

I add "onError="this.style.visibility = 'hidden'" , but sometimes I see an unknown image a second before it is "onError="this.style.visibility = 'hidden'" .

I want to catch an unknown image before displaying it and put the default image or hide the image.

+4
source share
1 answer

you can make img hidden by default and only make it visible if it loads correctly.

 <img id="viewerofinstore" src="{{filteredArray[imageIndex]}}" style="visibility:hidden" onload="this.style.visibility = 'visible'" width="297px" height="297px" /> 
+3
source

All Articles