Discussion :

[super_newbie_pro]

Bonjour
Comment feriez-vous pour que du texte puisse apparaitre quand vous passez votre souris sur une image ?

Ca permettrait un gain de place et éviter de mettre les descriptions des dites images en texte brute en dessous de ces dernières...

D'avance merci

[Bisûnûrs]

http://r-hunel.developpez.com/tutoriels/css/info-bulle/ ?

[popo]

S'il s'agit simplement d'une image, tu peux utiliser l'attribut "alt"

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<img src="monimage.jpg" alt="Mon texte au survol" />

[Auteur]

S'il s'agit simplement d'une image, tu peux utiliser l'attribut "alt"

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<img src="monimage.jpg" alt="Mon texte au survol" />

Ne confonds pas alt et title. L'attribut alt permet au navigateur d'afficher un texte si l'image n'existe pas. Cependant IE a tendance à afficher comme infobulle le contenu de alt si title n'est pas défini.

[c_s_s]

Il me semble que Firefox n'affiche pas le contenu de alt d'ailleurs, ce qui est normal.

[Auteur]

Il me semble que Firefox n'affiche pas le contenu de alt d'ailleurs, ce qui est normal.

si il l'accepte :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<img src="image.jpg" alt="Image inexistante" title="une image" />

Par ailleurs, une balise img sans attribut alt ne passe pas la validation W3C.

[super_newbie_pro]

http://r-hunel.developpez.com/tutoriels/css/info-bulle/ ?

Bonjour merci mais je ne comprends pas comment on intègre le code pour que ça ne s'affiche que quand on passe la souris sur une image...

Par exemple j'ai ça :

<p align="center"><img border="0" src="eos3000b.gif" width="512" height="384"></p>

<p align="center"><img border="0" src="resultat.gif" width="512" height="384"></p>

Je voudrais que quand on passe la souris sur l'image eos3000b.gif un texte s'affiche : << ceci est mon appareil photo. >> et lorsque la souris passe sur resultat.gif, << voila la qualité des photos >>

[popo]

Le tutoriel te montre comment afficher une infobulle sur le survol d'un lien grace à la pseudo class :hover.

Il ne me semble pas que les images bénéficient d'un tel pseudo classe. Donc tu dois placer ton image dans un lien.

Edit. Apparement si.

part contre il faut remplacer tes liens avec :hover par des images avec :hover pour que ça fonctionne

Re-Edit : Ne fonctionne pas sous IE inférieur à 7.