Javascript : problème aevc onMouseOver

Fermé
Sanader Messages postés 66 Date d'inscription samedi 15 novembre 2008 Statut Membre Dernière intervention 2 juillet 2010 - 15 nov. 2008 à 20:55
Sanader Messages postés 66 Date d'inscription samedi 15 novembre 2008 Statut Membre Dernière intervention 2 juillet 2010 - 15 nov. 2008 à 23:19
Bonjour,

Je fait encore une fois (ça devient franchement une habitude..) à ce site pour résoudre un problème.
..ou plutôt un casse-tête !

Mon problème est le suivant : Je cherche à créer un menu (en javascript). dans mon code, j'insère deux liens dans une même div. Ces deux liens affichent chacuns plusieurs liens à la manière d'un menu.

Quand la souris est dessus, les liens s'affichent, mais là ou réside mon problème, c'est que je souhaiterais que le liens n°2 qui affiche d'autre liens, cachent les liens qu'affiche le lien n°1 (vous suivez? ..je sais c'est un peu casse tête).

Voici donc mon code, j'ai beau ajouter la fonction hide à mon onMouseOver, pas moyen.. si quelqu'un peut m'aider..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title></title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
       <link rel="stylesheet" media="screen" type="text/css" title="blabla" href="" />
	   	<script type="text/javascript">
		function show(id) {
			//on récupère l'élément qui a l'identifiant donné en paramètre
			var toShow = document.getElementById(id);
			//on change la valeur du style css en visible
			toShow.style.visibility = 'visible';
		}
		
		function hide(id) {
			//on récupère l'élément qui a l'identifiant donné en paramètre
			var toHide = document.getElementById(id);
			//on change la valeur du style css en visible
			toHide.style.visibility = 'hidden';
		}

	</script>
   </head>
	<body> <!--On regroupe les liens qui affichent leurs enfants respectifs au passage de la souris-->
	<div class="Link" id="">
		<a href="" alt="" class="" id="" onMouseOver="show('SkyrockDisplay');">Skyrock</a>
		<a href="" alt="" class="" id="" onMouseOver="show('HotmailDisplay');">Hotmail</a>


	</div>
	
	<!--On regroupe les différents groupes de liens qui s'affichent au passage de la souris sur leurs parents respectifs-->
	<div class="SkyrockCustomize" id="SkyrockDisplay" style="visibility: hidden;" onMouseOut="hide('SkyrockDisplay');" onMouseOver="show('SkyrockDisplay');">
		<a href="" alt="" class="" id="">Skyrock</a>
		<a href="" alt="" class="" id="">Skyrock</a>
		<a href="" alt="" class="" id="">Skyrock</a>
	</div>
	
	<div class="HotmailCustomize" id="HotmailDisplay" style="visibility: hidden;" onMouseOut="hide('HotmailDisplay');" onMouseOver="show('HotmailDisplay'); hide('SkyrockDisplay');">
		<a href="" alt="" class="" id="">Hotmail</a>
		<a href="" alt="" class="" id="">Hotmail</a>
	</div>
</body>
</html>


Voilà, j'espère que quelqu'un saura résoudre mon énigme.
Merci

1 réponse

Marco la baraque Messages postés 996 Date d'inscription vendredi 9 mai 2008 Statut Contributeur Dernière intervention 5 novembre 2009 328
15 nov. 2008 à 21:09
Salut Sanader,
Il faut que tu mettes ce code sur le bon lien :
<div class="Link" id="">
	<a href="" alt="" class="" id="" onMouseOver="show('SkyrockDisplay'); hide('HotmailDisplay');">Skyrock</a>
	<a href="" alt="" class="" id="" onMouseOver="show('HotmailDisplay'); hide('SkyrockDisplay');">Hotmail</a>
</div>


Toi tu l'avais mis sur les sous-menus, pas sur les menus.

Cordialement,
1
Sanader Messages postés 66 Date d'inscription samedi 15 novembre 2008 Statut Membre Dernière intervention 2 juillet 2010 1
15 nov. 2008 à 23:19
Ah merci marco, décidément, je crois que je ne saurais pas faire grand chose sans toi en javascript..!

Tout fonctionne et comme d'habitude en programmation, l'erreur est enfantine !

Merci !!
0