11480 sujets

JavaScript, DOM et API Web HTML5

C'est encore moi, je donne un coup de main dans la réalisation du site web de la croix rouge à Singapour.

En fait je galère toujours avec mon menu : lorsqu'un sous menu est actif et la souris passe sur un autre item du menu (le sous menu de home est actif et je veux afficher les sous menu de Events par exemple) la souris ne passe pas sur une zone non active, résultat le sous menu ne s'affiche pas. Il faut passer la souris à l'extérieure de la zone active pour réactive le bazar...

voila ce que ça donne :
ebauche 1


	<script language="Javascript" type="text/javascript">
<!--
var delay = 10; //time in millisecondes before the menu appears or disappears
var nbmenu = 7;
window.onload=HideMenus; // start all is hidden

function Show(id) {
	var d = document.getElementById(id);
	HideMenus;
	d.style.display='block';
}

function HideDelay() {
	timeout = setTimeout('HideMenus()',delay);
}	

function HideMenus() {
		for (var i = nbmenu; i>0; i--) {
			if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
		}
}

function CancelHide() {
	if (timeout) {clearTimeout(timeout);}
}
-->
</script>

</head>
<body>

<div id="conteneur">

	<div id="header">

	<img class="logo" src="img/logo.gif" alt="logo"  title="Singapore redcross logo" height="76" width="157"><p><a href="#" title="About us">About us</a>|<a href="#" title="About us">International</a></p>
	 </div>

<div id="topmenu">

	<div id="menu">
	<dl>
		<dt class="main" onmouseout="HideDelay();" onmouseover="Show('smenu1');"><a href="#" onmouseover="Show('smenu1')" onfocus="Show('smenu1');" >&nbsp;Home |</a></dt>

			<dd id="smenu1" 
					onmouseover="CancelHide();"
		     			onmouseout="HideDelay();"
		     			onfocus="CancelHide();"
		     			onblur="HideDelay();">

				<ul>
					<li><a href="#">&#187; About Us</a></li>
					<li><a href="#">&#187; The SRC Council</a></li>
					<li><a href="#">&#187; Our Financial Information</a></li>

				</ul>
			</dd>
	</dl>


Merci d'avance à l'expert qui m'aidera.
Modifié par Nicolas Pontoizeau (31 Mar 2005 - 06:17)
Bonjour,
Voici ce que je te propose:

var delay = 10; //time in millisecondes before the menu appears or disappears
var nbmenu = 7;
[b][#red]var	timeout = setTimeout('HideMenus()',0);
var menEncours="";[#black][/b]
window.onload=HideMenus[b][#red]()[#black][/b]; // start all is hidden

function Show(id) {
[b][#red]	if ((menEncours!=id)&&(menEncours!="")) HideMenus(); else CancelHide();
	menEncours=id;[#black][/b]
	var d = document.getElementById(id);
[b][#darkblue] HideMenus;[#black][/b]
	d.style.display='block';
}

Ce que j'ai ajouté --> en rouge
Ce que j'ai enlevé --> en bleu

Le reste à l'identique
Bon courage Smiley cligne