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
Configuration: Windows XP
Firefox 3.0.4
XHTML 1.0 Strict
Alert javascript
