Problème de menu sous Firefox

[Aquarius]

Bonjour à tous,

j'ai un petit soucis de scintillement de sous-menu au passage de la souris sous Firefox et je n'arrive pas a y remédier.

Le code du menu :

<dl id="menug">
  <dt onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre();"><a href="/">USJ86</a></dt>
 	 <dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre();">
    <ul>
   	 <li><a href="#">Tournoi de l'USJ86</a></li>
   	 <li><a href="#">Quelques chiffres</a></li>
   	 <li><a href="#">Partenaires</a></li>
    </ul>
 	 </dd>	
  <dt onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre();"><a href="/">Sections</a></dt>
 	 <dd id="smenu2" onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre();">
    <ul>
   	 <li><a href="#">Pays Mélusin</a></li>
   	 <li><a href="#">Saint Julien l'Ars</a></li>
    </ul>
 	 </dd>	
  <dt onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre();"><a href="/">Judo</a></dt>
 	 <dd id="smenu3" onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre();">
    <ul>
   	 <li><a href="#">Bibliographie</a></li>
   	 <li><a href="#">Lexique</a></li>
    </ul>
 	 </dd>
</dl>

et la feuille de style qui va avec :

/* CSS Document pour le menu gauche déroulant et rollover */
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}

#menug {
position:relative;
width: 100%;
}

#menug dt {
cursor: pointer;
height: 26px;
line-height: 26px;
margin: 0;
text-align: center;
font-weight: bold;
}

#menug dd {
background: #D6D0D0;
position: absolute;
z-index: 100;
left: 9em;
margin-top: -1.5em;
width: 10em;
border: 1px solid gray;
}


#menug li {
text-align: center;
font-size: 90%;
height: 18px;
line-height: 18px;
}
#menug li a {
background: #D6D0D0;
color: #000000;
text-decoration: none;
display: block;
width: 100%;
}
#menug li a:hover {
background: #F0F0F0;
width: 100%;
}

#menug dt a {
background: url(../images/bouton-menu3.jpg) 0 0;
display: block;
color: #000000;
text-decoration: none;
width: 170px;
}
#menug dt a:hover {
background: url(../images/bouton-menu3.jpg) 0 -26px;
display: block;
color: #FFFFFF;
width: 170px;
}

Je gère tout ça avec un bout de 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>

Voilà tout est dis.

Merci d'avance pour vos réponses.

Modifié 31 Août 2005 par Aquarius

[mikhawa]

Slt, y a-t'il moyen de voir le menu en question (url)?

[Aquarius]

Bien sur : -http://www.usj86.com/USJ86v3/

[Dudu]

Cela n'aurait-il rien à voir avec les problèmes de cache évoqués tout en bas de cet article ?

[Aquarius]

J'y avais pensé mais malheureusement mon problème ne viens pas d'IE mais se produit sous FireFox... et je n'ai jamais rien modifié dans les réglages de bases de ce navigateur.

Modifié 31 Août 2005 par Aquarius

[Xavier]

OOoh ! Comme ce menu est joli sans javascript

Quant aux clignottements, la future version de Firefox 1.5 devrait corriger pas mal de problème. Essaye de regarder cette page avec Firefox : c'est Las Vegas (et encore, sur certaines pages il arrive que les titres se trémoussent en défilant !)

[Aquarius]

Désolé Xavier, mais je n'arrive pas à charger ta page.

[Xavier]

Pourtant j'ai bien dit :

regarder cette page avec Firefox

<{POST_SNAPBACK}>

(j'ajoute le gras pour que ce soit clair, c'est du XHTML donc forcément ça ne passe pas dans IE )

PS : pour les utilisateurs d'Opera et/ou Safari, si je dis avec Firefox c'est juste parce qu'il n'y a qu'avec lui et Mozilla que le bug pourra être vu, je pense que la page passe bien dans Opera et dans Safari, bien que je n'aie pas eu l'occasion de la tester personnellement dans ce dernier.

Modifié 1 Septembre 2005 par Xavier

[Aquarius]

Donc pour toi, Xavier, il n'y a pas de solution à mon problème, mis à part attendre la prochaine version de Firefox... et pour ceux qui vont garder leur ancienne version, c'est perdu alors.

Je pense qu'il doit y avoir une autre solution, mais personnellement je ne la connais pas ...

[Xavier]

Quand il y a un bug, il y a quasiment toujours un moyen de le contourner. Par exemple en ajoutant un div à l'intérieur des dd peut-être. Mais bon, ça fait du code sale et c'est plus difficile à maintenir.

De plus je doute que Firefox soit comme IE ou Netscape et s'accroche très longtemps après la nouvelle version (surtout quand on sait quelles seront les améliorations !)

PS : fais attention au redimentionnement, ça passe très mal

Modifié 1 Septembre 2005 par Xavier

[Dudu]

et pour ceux qui vont garder leur ancienne version, c'est perdu alors.

Ils sont moins nombreux que ceux qui surfent sans Javascript et pour qui ton menu est quasi-inacessible

Xavier: c'est marrant mais avec la dernière version de Firefox pour Mac, je n'ai aucun clignotement sur ta page "Las Vegas"

Ni avec aucun autre navigateur d'ailleurs (a fortiori avec IE 5 Mac là c'est clair çà ne clignote pas )

[Xavier]

Xavier: c'est marrant mais avec la dernière version de Firefox pour Mac, je n'ai aucun clignotement sur ta page "Las Vegas"

Ah bon ? Quand tu dis dernière version c'est bien 1.0.6 ?

Firefox/Mac est sensiblement différent des versions Windows et Linux. Surtout au niveau de l'interface, mais au niveau du menu aussi.

Pour les clignottements/vibrations, c'est surtout au niveau du menu que ça le fait. Il y a d'ailleurs eu quelques améliorations assez récemment (je ne sais plus quand exactement, mais tous mes titres bougeaient également). Toujours est-il que ça reste visible et assez désagréable (pas trop, car ça ne bouge qu'au défilement...)