11548 sujets

JavaScript, DOM et API Web HTML5

Voilà pour mon site Mon Site j'ai réalisé un petit menu horizontal en javascript. Afficher sous Opera il n'y a aucun probléme, par contre sous firefox et internet explorer je me retrouve avec les 3 derniers boutons (cours, evenements et liens) décaler par rapport au premier et je ne sais pas pourquoi.
Je vous mets le code du menu si cela peut aider !!

Dans le head :
<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>

</head>


Le code du menu ensuite dans le body:

<div id="boutons">
		<dl>
		<dt onmouseover="javascript:montre('smenu1');"><a
href="index.php?contenu=acceuil"><img src="images/acceuil.png"
		alt=""onMouseOver="this.src='images/rollover_acceuil.png'"
		onMouseOut="this.src='images/acceuil.png'" border="0"/></a></dt>
				<dd id="smenu1">
					<ul>
					      <li><a href="index.php?contenu=actu">Actualités de
l'Université</a></li>
						<li><a href="index.php?contenu=association">Infos sur notre Asso</a></li>
					</ul>
				</dd>
		</dl>
	&nbsp;
		<dl>
		<dt onmouseover="javascript:montre('smenu2');"><a
href="index.php?contenu=cours"><img src="images/cours.png"
		alt="" onMouseOver="this.src='images/rollover_cours.png'"
		onMouseOut="this.src='images/cours.png'" border="0"/></a></dt>
               </dl>
	&nbsp;

		<dl>
		<dt onmouseover="javascript:montre('smenu3');"><a
href="index.php?contenu=evenements"><img src="images/evenement.png"
		alt="" onMouseOver="this.src='images/rollover_evenement.png'"
		onMouseOut="this.src='images/evenement.png'"border="0" /></a></dt>
					<dd id="smenu3">
						<ul>
							<li><a href="index.php?contenu=visites">Visites</a></li>
							<li><a href="index.php?contenu=voyages">Voyages</a></li>
							<li><a href="index.php?contenu=archives">Archives</a></li>
							<li><a href="index.php?contenu=soirees">Nos soirées</a></li>
						</ul>
					</dd>
		</dl>
	&nbsp;
		<dl>
		<dt onmouseover="javascript:montre('smenu4');"><a
href="index.php?contenu=liens"/> <img src="images/liens.png"
		alt="" onMouseOver="this.src='images/rollover_liens.png'"
		onMouseOut="this.src='images/liens.png'" border="0"/></a></dt>
		</dl>
</div>


Merci d'avance pour ceux qui tenterons de m'aider Smiley biggrin
Modifié par Hermiaude (02 Mar 2008 - 13:47)
Bonjour Hermiaude,
Pour moi, il ne me semblait pas que l'erreur venait de js mais plutôt d'interprétation de ton code html + css par le navigateur. J'ai donc pris les deux sources, j'ai mis un border sur certains éléments afin d'essayer de comprendre d'où venait le problème. Le décalage vient au niveau des dl (même sous op mais uniquement le dernier!!). Je regarde les codes, je vois des
&nbsp;
entre les dl, je les enlève et magie du web, tout se réaligne Smiley cligne .
Bonne continuation.
Modifié par comar91 (02 Mar 2008 - 07:23)
Merci beaucoup, j'avais mis des espaces au debut que je faisais cette page a cuase d'un probléme de placment et donc j'ai jamais essayé de l'enlever. Merci..Beaucoup.