18041 sujets

Questions générales et questions de débutants

Menu javascript et padding, pb IE6 [résolu]

Bonjour,
j'ai déjà posé la question sur le forum javascript, mais sans réponse, alors je retente ma chance ici !
J'ai un souci avec IE6 pour mon menu :

Javascript :

<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>


HTML :

<div id="menu">

	<dl>			

		<dt onMouseOver="javascript:montre('smenu1');">test menu </dt>

			<dd id="smenu1" onMouseOver="javascript:montre('smenu1');" onMouseOut="javascript:montre('');">

				<ul>

					<li><a href="#"><img src="images/pucenoir.gif" alt="puce" /> Philosophie</a></li>

					<li><a href="#"><img src="images/pucenoir.gif" alt="puce" /> Localisation</a></li>

					<li><a href="#"><img src="images/pucenoir.gif" alt="puce" /> L'équipe</a></li>

					<li><a href="#"><img src="images/pucenoir.gif" alt="puce" /> Historique</a></li>

				</ul>



			</dd>

	</dl>	

</div>


Et Css :

* { margin:0; padding:0; }
body {
background: white;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
text-align:center;
}
dl, dt, dd, li {
margin: 0;
padding: 0;
list-style-type: none;
}
ul{
list-style-image:none;
}
#menu {
position: absolute;
top: 178px;
left: 80px;
z-index:100;
width: 176px;
font-size:87%;
}
#menu dl {
float: left;
width: 11em;
margin: 0 1px;
}
#menu dt {
cursor: pointer;
text-align: left;
font-weight: bold;
}
#menu li {
text-align: left;
font-weight: bold;
/*padding: 4px;*/
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}


Mon problème, c'est que j'aimerais mettre mon padding :4px dans #menu li, mais que si je le fais, IE6 plante le menu (on ne peut plus cliquer sur la liste déroulante, comme si le onmouseout ne fonctionnait plus comme il faut avec ce padding).
Comment je peux régler ce problème ?
Merci d'avance !
Modifié par maryline (10 Jan 2007 - 14:27)
Bonjour,

Je crois avoir lu quelque part ici que certains spécialistes du javascript semblaient insister pour que l'on écrive onMouseOver comme ça onmouseover… À vérifier, donc.

Ah et

window.onload=montre;


ne devrait pas être dans ? :

<body onload="montre();"> <-- avec les parenthèses ?

Modifié par zzzazzz (10 Jan 2007 - 14:25)
zzzazzz a écrit :
Je crois avoir lu quelque part ici que certains spécialistes du javascript semblaient insister pour que l'on écrive onMouseOver comme ça onmouseover… À vérifier, donc.
Rien à voir avec JavaScript. En XHTML, les attributs s'écrivents en minuscules.
zzzazzz a écrit :
Ah et

window.onload=montre;


ne devrait pas être dans ? :

<body onload="montre();"> <-- avec les parenthèses ?
Euh non, bien au contraire. As-tu lu les tutoriels JavaScript ? Ou la traduction de l'article de Peter-Paul Koch ?
zzzazzz a écrit :
pas du tout, c'est l'occasion de regarder, merci (javascript et moi ca fait pas 2 mais presque) Smiley cligne
Mon intervention n'aura pas été totalement inutile alors. Smiley cligne
Sujet clos
Aller à