afficher une image en javascript en passant sur un menu

[zup17]

Bonjour,

J'ai utilisé le script JavaScript afficher/cacher,
car je souhaite, grâce à un menu en passant ma souris
dessus (survole) afficher une image dans une autre div que celle du menu,
mais comme étant débutant je n'arrive pas à faire ce que je veux.
J'arrive à afficher l'image quand je survole le menu, mais je ne souhaite pas que l'image se masque quand je quitte le survole.
Et quand je passe sur l'autre élément de menu au survole que l'autre image s'affiche et reste afficher tant que je ne suis pas allé sur un autre élément de menu et ainsi de suite.

voila mon code et merci de votre aide.

Code :

1
2
3
4
5
6
7
8
<script type="text/javascript">
function affiche(elem){
document.getElementById(elem).style.visibility="visible";
}
function masque(elem){
document.getElementById(elem).style.visibility="hidden";
}
</script>

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
<div id="content">
 
<!-- La, c'est ce qui s'affichera au survole-->
<div id="texte_icone_a">
<img src="images/page_t3d12.jpg" alt="accueil camion T3d12"/>
</div>
<!--texte_icone_a-->
 
<div id="texte_icone_b">
<img src="images/page_t3d16.jpg" alt="camion T3d16"/>
</div>
 
 <!-- et tu fais pareil avec icone-b et ainsi de suite...-->
 
</div>
 
 
  <ul id="menu">
    <li id="icone_a" onMouseOver="javascript:affiche('texte_icone_a')"; onMouseOut="javascript:masque('texte_icone_a')";><a href="#" class="accueil" rel="shadowbox[Mixed]"; title="accueil ">T3D12</a></li><!--icone_a-->
 
    <li id="icone_b" onMouseOver="javascript:affiche('texte_icone_b')"; onMouseOut="javascript:masque('texte_icone_b')";><a href="#" class="savoir-faire" rel="shadowbox[Mixed]"; title="accueil ">T3D16</a></li><!--icone_b-->
 
    <li id="icone_c" onMouseOver="javascript:affiche('texte_icone_c')"; onMouseOut="javascript:masque('texte_icone_c')";><a href="#" class="telechargement" rel="shadowbox[Mixed]"; title="accueil ">ÉTUDE DE
CARROSSAGE</a></li><!--icone_c-->
 
    <li id="icone_d" onMouseOver="javascript:affiche('texte_icone_d')"; onMouseOut="javascript:masque('texte_icone_d')";><a href="#" class="references" rel="shadowbox[Mixed]"; title="accueil ">SERVICES</a></li><!--icone_d-->
 
    <li id="icone_e" onMouseOver="javascript:affiche('texte_icone_e')"; onMouseOut="javascript:masque('texte_icone_e')";><a href="#" class="services" rel="shadowbox[Mixed]"; title="accueil ">DOCUMENTS
À TÉLÉCHARGER</a></li><!--icone_e-->
 
    <li id="icone_f" onMouseOver="javascript:affiche('texte_icone_f')"; onMouseOut="javascript:masque('texte_icone_f')";><a href="#" class="contact" rel="shadowbox[Mixed]"; title="accueil ">BOUTIQUE</a></li><!--icone_f-->
 
  </ul>

merci merci

[zup17]

Je vous envoie un liens ou il y a l'effet que je recherche :
lien
quand vous êtes sur la page la grande photo avec le menu sur la droite,
quand on survole le menu les images s'affiche, si on quitte le menu la photo reste et quand on passe sur un autre élément de menu la photo s'affiche.
Je suis débutant ca doit être simple mais je galère.

Merci à vous

[andry.aime]

Bonjour,

Utilise display="none" ou "inline" à la place de visibility.

A+.

[NoSmoking]

Bonjour,

Envoyé par zup17

J'arrive à afficher l'image quand je survole le menu, mais je ne souhaite pas que l'image se masque quand je quitte le survole.

supprimes l'action sur le onmouseout.