Aller au contenu

A hover sur image


leditvalentin

Sujets conseillés

Bonjour,

Je voudrais savoir si il est possible à l'aide de la propriété a hover de modifier une image lorsqu'elle est survolé par une autre image ?

Merci de votre aide

Modifié par leditvalentin
Lien vers le commentaire
Partager sur d’autres sites

Salut,

Après une courte visite sur ton site je ne peux que difficilement éviter le hors-sujet, mais je tiens à te faire la remarque suivante : je ne suis pas certain que le choix du rouge pour ton texte soit très judicieux. Je ne trouve pas le texte très agréable à lire dans cette couleur. ;)

Lien vers le commentaire
Partager sur d’autres sites

Je voudrais savoir si il est possible à l'aide de la propriété a hover de modifier une image lorsqu'elle est survolé par une autre image ?

C'est tout à fait possible, mais potentiellement problématique pour l'accessibilité.

S'il s'agit de remplacer une image de fond décorative par une autre image de fond décorative, pas de problème. S'il s'agit de remplacer une image portant une information (par exemple le texte d'un bouton) par une autre image, le tout en passant par les feuilles de style CSS... c'est pas terrible. L'information, qui devrait se trouver dans le code HTML, est déportée dans la feuille de style, et donc non accessible à tout un tas d'outils : lecteurs d'écran, robots d'indexation, etc.

Pour faire une image-bouton avec effet de survol, mieux vaut :

- utiliser une image HTML avec attribut alt correctement renseigné ;

- changer l'image au survol, avec Javascript.

Faire tout ça en CSS est séduisant sur le papier, mais à bien y réfléchir c'est pas vraiment une bonne idée.

(Nota : et les techniques de remplacement d'image, consistant caser un texte dans le contenu HTML et à le cacher en CSS pour le remplacer par une image de fond, sont loin d'être parfaites, même si elles peuvent parfois représenter une alternative intéressante.

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...