Texte au survol d'une image

Bonjour à tous,

pour le site que je suis en train de développer j'ai besoin d'un texte qui s'affiche au survol d'une image.

Ne connaissant rien au JS, j'ai trouvé un bout de code qui me permet de le faire et qui marche très bien. Le souci arrive quand j'ai 3 images les unes à coté des autres dans une div (en CSS) et que je veux qu'en passant sur chaque image un texte différent pour chaque image apparaisse dans ma div.

Pour le moment j'ai un bug qui fait que les 2 premiers textes s'affichent automatiquement dès l'arrivée sur la page alors que je souhaiterais qu'il n'y en ait aucun.

Je vous mets ici le code (désolé j'ai fait du bricolage pour tester) dans le header de la page:

<script type="text/javascript">
<!--

window.onload=montre;

function montre(id) {

var d = document.getElementById(id);

        if (document.getElementById('legende')) {document.getElementById('legende').style.display='none';}

if (d) {d.style.display='block';}

}

window.onload=montre3;

function montre3(id) {

var d3 = document.getElementById(id);

        if (document.getElementById('legende3')) {document.getElementById('legende3').style.display='none';}

if (d3) {d3.style.display='block';}

}//-->

</script>

et ceci pour l'appel de la fonction au survol des images:

<dt onmouseover="javascript:montre('legende');" onmouseout="javascript:montre('') ;"><a href="#"><img src="img/p4_equipe_sako.jpg" width="136" height="270"/></a></dt>
<dt onmouseover="javascript:montre3('legende3');" onmouseout="javascript:montre3('') ;"><a href="#"><img src="img/p4_equipe_jean.jpg" width="135" height="270"/></a></dt>

Et ceci pour l'affichage de la légende:

 <dd id="legende"> Texte </dd>

Si vous avez une solution, je suis évidemment preneur.

Je vous remercie d'avance.

Merci pour ton aide, en effet je devais juste mettre le di"splay:none" et ca roule.

Salut Shagrath69, je t'ai piqué ton code et l'ai utilisé, et j'ai trouvé une autre solution, en fait ton code affiche le texte meme lorsque l'on passe en dehors de l'image MAIS sur sa meme ligne,
car en effet dans ton code tu effectue le Mouseover du le DIV.

Le code qu'il te faut pour ton image est le suivant :

<a href=#><img src=0003.gif onmouseover="javascript:montre('legende');" onmouseout="javascript:montre('') ;"></a>

grace a cela ton texte ne s'affichera uniquement sur le survol de ton image!

Voila ! a bientot

Bonjour,

Le script est vraiment pas mal, mais je rencontre un souci.

Je modifié ce script en supprimant le onmouseout car je voudrais que la légende reste même si je ne suis plus sur mon image.
Par contre dès que je suis sur une autre image, je voudrais que la légende précédente s'efface et que la nouvelle s'affiche.

Auriez-vous une solution à me donner ?

Merci pour votre aide

Bonjour,
il eu mieux valu faire un nouveau post, mais bon, il te suffit d'écrire un cookie lorsque la légende apparaît et de lire son état lorsque tu ouvres une nouvelle page, ainsi si le cookie existe tu passes le display de none à block par exemple.
;O)