Comment afficher un texte alternatif pour une image en chrome

Question

L'image avec une source non valide affiche un texte alternatif dans Firefox mais pas en chrome, à moins que la largeur de l'image ne soit ajustée.

   <img height="90" width="90"
    src="http://www.google.com/intl/en_ALL/images/logos/images_logo_lg.gif"
    alt="Image Not Found"/>
 

Comment afficher le texte alternatif d'une image?

Answer 1

Si je suis correct, il s’agit d’un bogue dans le webkit (selon cela ). Je ne suis pas sûr qu'il y ait beaucoup à faire, désolé pour la réponse faible.

Il existe cependant un moyen de contourner le problème. Si vous ajoutez l'attribut title à votre image (par exemple, title="Image Not Found" ), cela fonctionnera.

Answer 2

Vous pouvez utiliser l'attribut title .

 <img height="90" width="90"
src="http://www.google.com/intl/en_ALL/images/logos/images_logo_lg.gif"
alt="Image Not Found" title="Image Not Found" />
 

Answer 3

Oui, c’est un problème qui concerne Webkit et qui est également signalé en chrome: http://code.google.com/p/chromium/issues/detail?id=773 C’est là depuis 2008 ... et toujours pas corrigé !!

J'utilise un morceau de javacsript et jQuery pour résoudre ce problème.

 function showAlt(){$(this).replaceWith(this.alt)};
function addShowAlt(selector){$(selector).error(showAlt).attr("src", $(selector).src)};
addShowAlt("img");
 

Si vous voulez seulement quelques images:

 addShowAlt("#myImgID");
 

Answer 4

Utiliser l'attribut title au lieu de alt

 <img
  height="90"
  width="90"
  src="http://www.google.com/intl/en_ALL/images/logos/images_logo_lg12.gif"
  title="Image Not Found"
/>
 

Answer 5

Voici une solution de contournement simple dans jQuery. Vous pouvez l'implémenter en tant que script utilisateur pour l'appliquer à chaque page affichée.

 $(function () {
  $('img').live('mouseover', function () {
    var img = $(this); // cache query
    if (img.title) {
      return;
    }
    img.attr('title', img.attr('alt'));
  });
});
 

J'ai également implémenté cela en tant qu'extension Chrome appelée alt . Comme il utilise jQuery.live , il fonctionne également avec le contenu chargé dynamiquement.