J'essaie de masquer mes menus déroulants lorsque la souris ne passe plus dessus.

Cela fonctionne correctement sous Firefox, par-contre sous IE6 ou 7 je n'arrive pas à accéder à toutes les options du menu.

Mon programme principal :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
35
36
37
38
 
<?php
 
require('TestMenu_5.html');
 
?>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
 
<head>
 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
<link href="CSS/Menu_2.css" rel="stylesheet" type="text/css" />
 
<title>Test affiche menu</title>
 
</head>
 
 
 
<body>
 
<div id = "contenu">
 
  <form name="form1" method="post" action="">
 
    CECI EST UN TEST 
 
  </form>
 
</div>
 
</body>
 
</html>
Mon menu :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
 
script type="text/javascript">
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=10; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none'; } 
	}
if (d) {d.style.display='block';}
}
</script>
 
<div id="menu">
	<dl>
		<dt onmouseover="javascript:montre();"><a href="Deconnexion.php">Déconnexion</a></dt>
	</dl>
	<dl>			
		<dt onmouseover="javascript:montre('smenu1');">Données Personnelles.</dt>
			<dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre('');"> 
		<!--	<dd id="smenu1"> -->
				<ul>
					<li><a href="DonneesPersonnellesFormulaireModification.php">Fiche personnelle : Modification</a></li>
					<li><a href="AffichageDonneesPersonnelles.php">Fiche personnelle : Visualisation</a></li>
					<li><a href="PoidsListe.php">Suivi du poids.</a></li>
				</ul>
			</dd>
	</dl>
	<dl>	
		<dt onmouseover="javascript:montre('smenu2');" >Footings</dt>
			  <dd id="smenu2" onmouseover="javascript:montre('smenu2');"  onmouseout="javascript:montre('');">  
		  <!-- <dd id="smenu2"> -->
				<ul>
					<li><a href="ParcoursListe.php">Parcours.</a></li>
					<li><a href="FootingsListe.php">Footings.</a></li>
					<li><a href="FractionneListe.php">Fractionnés.</a></li>
				</ul>
			</dd>
	</dl>
	<dl>	
		<dt onmouseover="javascript:montre('smenu3');">Statistiques</dt>
			 <dd id="smenu3" onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre('');">
			<!-- <dd id="smenu3">  -->
				<ul>
					<li><a href="StatistiquesAnnuelles.php">Km  parcourus par ann&eacute;e.</a></li>
					<li><a href="StatsParcours.php">Parcours</a></li>
					<li><a href="StatistiquesSemaines.php">Km parcourus par semaine.</a></li>
					<li><a href="StatistiquesComparatifSemaines.php">Statistiques comparatives par semaines.</a></li>
				<li><a href="StatistiquesPoids.php">Statistiques poids.</a></li>
				</ul>
			</dd>
	</dl>
	<dl>	
		<dt onmouseover="javascript:montre('smenu4');">Utilitaires</dt>
			 <dd id="smenu4" onmouseover="javascript:montre('smenu4');" onmouseout="javascript:montre(' ');"> 
		<!-- 	 <dd id="smenu4"> -->
			 	<ul>
					<li><a href="Abecedaire.php">Abécédaire.</a></li>
					<li><a href="Moyenne.php">Calcul de moyenne.</a></li>
					<li><a href="TableauTempsVitesses.php">Tableau des vitesses.</a></li>
					<li><a href="TableauFCM.php">Tableau des fréquences cardiaques</a></li>
				</ul>
			</dd>
	</dl>
	<dl>	
		<dt onmouseover="javascript:montre('smenu5');">?</dt>
			 <dd id="smenu5" onmouseover="javascript:montre('smenu5');" onmouseout="javascript:montre('');"> 
		<!-- 	<dd id="smenu5"> -->
				<ul>
					<li><a href="AideLigne/GestionFootings.htm">Aide.</a></li>
				<li><a href="APropos.php">A propos.</a></li>
					<li><a href="EnvoiMailWebmaster.php">Contact.</a></li>
				</ul>
			</dd>
	</dl>
</div>
Ma feuille de style:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
 
body {
margin: 0;
padding: 0;
background: #FEEEBC;
font: 12px verdana, sans-serif;
}
#menu {
width:100%;
top:0px;
z-index: 2;
float:left;
position:absolute;
font: 11px verdana, sans-serif;
}
#menu dl {
float: left;
width: 14em;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #3B4E77;
color: #fff;
border: 1px solid gray;
margin: 1px;
}
#menu dd {
display: none;
border: 1px solid gray;
color: #fff;
background: #3B4E77;
}
#menu li {
text-align: center;
background: #3B4E77;
margin: 10px;
}
#menu li a, #menu dt a {
color: #fff;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu li a:focus, #menu dt a:hover, #menu dt a:focus { 
background: #F2462E;
border-right: 1px solid #fff;
}
div#contenu {
	width:1200px;
	height:600px;
	top:70px;
	left:10px;
	float:left; 
	z-index: 1;
	position:absolute;
	}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}