Beter omgaan met gebroken afbeeldingen - CSS-trucs

Anonim

Ontbrekende afbeeldingen zullen ofwel gewoon niets weergeven, ofwel een (?) Stijlvak weergeven wanneer hun bron niet kan worden gevonden. In plaats daarvan wilt u dat misschien vervangen door een afbeelding met een "ontbrekende afbeelding" waarvan u zeker weet dat deze bestaat, zodat er betere visuele feedback is dat er iets mis is. Of misschien wilt u het helemaal verbergen. Dit is mogelijk omdat afbeeldingen die een browser niet kan vinden, worden geactiveerd door een "fout" JavaScript-gebeurtenis waar we naar kunnen kijken.

// Replace source $('img').on("error", function() ( $(this).attr('src', '/images/missing.png.webp'); )); // Or, hide them $("img").on("error", function() ( $(this).hide(); ));

Bovendien wilt u misschien een of andere Ajax-actie activeren om een ​​e-mail naar een sitebeheerder te sturen wanneer dit gebeurt.