Aller au contenu

Bug Javascript / CSS avec Firefox


enroc

Sujets conseillés

Bonjour,

je cherche à faire un menu fonctionnel pour tous les navigateurs (merci à alsacreations pour la structure du menu ;)), ce qui requiert un peu de javascript. Or, Firefox semble bugger.

Lorque que je charge la page, le script s'exécute, et rien ne se passe. Si je redimenssionne la fenêtre (double-clic sur la barre du haut par exemple) alors l'affichage correspond à celui attendu.

Opera (8) ne connait pas se problème, Internet Explorer (6) non plus, et vu que le code javascript est très simple, je crois que c'est un bug. Votre avis est demandé :) ... et dans l'affirmative, avez vous des conseils pour faire un report de bug ?

Edit : j'ai trouvé un bug qui semble similaire.

Voici le code source utilisé, visible (temporairement) en ligne

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>BUG</title>
<script type="text/javascript">
<!--
window.onload = makeCleanMenu;
function makeCleanMenu()
{
/* positionnement absolu de "#menu ul"
 * C'est là que ça ne marche pas pour Firefox */
subMenusUList = document.getElementById("menu").getElementsByTagName("ul");
for(i=0;i<subMenusUList.length;i++) {
 subMenusUList[i].style.position="absolute";
}//*/
}
//-->
</script>
<style type="text/css">
<!--
body {
margin:0;padding:0;
}
#menu dl {
float:left;
}
#menu ul {
/* Si j'utilise ce propriété ici ça marche mais pas en javascript.
position:absolute;/**/
}
-->
</style>
</head>

<body>
<p>Pour tester le bug sous Firefox, redimensionner la fenêtre </p>

<div id="menu">
<dl>
 <dt><a href="javascript:void(0)">Titre 1</a></dt>
 <dd>
 <ul>
   <li><a href="#">Item 1.1</a></li>
   <li><a href="#">Item 1.2</a></li>
   <li><a href="#">Item 1.3</a></li>
 </ul>
 </dd>
</dl>
<dl>
 <dt><a href="javascript:void(0)">Titre 2</a></dt>
 <dd>
 <ul>
   <li><a href="#">Item 2.1</a></li>
   <li><a href="#">Item 2.2</a></li>
   <li><a href="#">Item 2.3</a></li>
 </ul>
 </dd>
</dl>
<dl>
 <dt><a href="javascript:void(0)">Title 3</a></dt>
 <dd>
 <ul>
   <li><a href="#">Item 3.1</a></li>
   <li><a href="#">Item 3.2</a></li>
   <li><a href="#">Item 3.3</a></li>
 </ul>
 </dd>
</dl>

</div>
</body>
</html>

Modifié par enroc
Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...