Bedre ødelagt billedhåndtering - CSS-tricks

Anonim

Manglende billeder viser enten intet eller viser en (?) Stilboks, når deres kilde ikke kan findes. I stedet vil du måske erstatte det med en "manglende billede" -grafik, som du er sikker på, eksisterer, så der er bedre visuel feedback om, at noget er galt. Eller du vil måske skjule det helt. Dette er muligt, fordi billeder, som en browser ikke kan finde, udløser en "fejl" JavaScript-begivenhed, som vi kan se efter.

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

Derudover vil du muligvis udløse en slags Ajax-handling for at sende en e-mail til en webstedsadministrator, når dette sker.