Problème menu déroulant [self-résolu]

Marsh Posté le 09-12-2005 à 10:12:03

bonjour

Suivant l'exemple de ce menu : http://css.alsacreations.com/xmedi [...] smenu3.htm, j'ai créé un menu déroulant horizontal.
Vous pouvez le voir ici : http://www.koama.com/makoa/

Sous firefox, il marche sans problème.
Sous IE, lorsque je pointe sur un élément du menu, le sous-menu s'affiche verticalement. Et à ce moment, lorsque je pointe sur l'endroit où devrait être le sous-menu, il s'affiche comme je voudrais. En plus, quand on est dans les premiers sous-menus ça fait juste ça, mais quand on va dans les sous-menus vers la droite, les sous-menus reviennent à la ligne. C'est pas facile à expliquer, alors vous pouvez aller voir

Voici mon code HTML :

Code :

<div id="menuprincipal">
<ul>
<li><a href="#" class="menu-on" onmouseover="montrerMenu('')">Sommaire</a></li>
<li><a href="#" onmouseover="montrerMenu('ssmenu1')">MAKOA</a>
<ul id="ssmenu1" style="visibility:hidden" >
<li><a href="#" >L'approche</a></li>
<li><a href="#" >Les produits</a></li>
</ul>
</li>
<li><a href="#" onmouseover="montrerMenu('ssmenu2')">Entreprises</a>
<ul id="ssmenu2" style="visibility:hidden" >
<li><a href="#" >France Telecom</a></li>
<li><a href="#" >Huguet</a></li>
<li><a href="#" >Kelchoix</a></li>
<li><a href="#" >Références</a></li>
</ul>
</li>
<li><a href="#" onmouseover="montrerMenu('ssmenu3')">Editeurs</a>
<ul id="ssmenu3" style="visibility:hidden" >
<li><a href="#" >Editions Bayard</a></li>
<li><a href="#" >Magazine Elle</a></li>
<li><a href="#" >Références</a></li>
<li><a href="#" >Editions Larousse</a></li>
</ul>
</li>
<li><a href="#" onmouseover="montrerMenu('ssmenu4')">Institutions</a>
<ul id="ssmenu4" style="visibility:hidden" >
<li><a href="#" >KOAMA</a></li>
<li><a href="#" >CESR</a></li>
<li><a href="#" >Uffeb</a></li>
<li><a href="#" >Références</a></li>
</ul>
</li>
<li><a href="#" onmouseover="montrerMenu('ssmenu5')">Contactez-nous</a>
</li>
</ul>
</div>

mon code JS :

Code :

function montrerMenu(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('ssmenu'+i)) {
//document.getElementById('ssmenu'+i).style.display = 'none';
document.getElementById('ssmenu'+i).style.visibility = 'hidden';
}
}
if (d) {
d.style.visibility = 'visible';
}
}

Et mon CSS :

Code :

#menuprincipal {
clear: both;
padding-left: 10px;
text-align: center;
margin: 0;
padding: 0;
height: 55px;
position: relative;
}
#menuprincipal ul {
margin: 0;
padding: 0;
}
#menuprincipal li {
list-style-type: none;
margin: 0 2px 0 0;
display: block;
float: left;
}
/*
* Liens
*/
#menuprincipal a {
display: block;
width: 110px;
text-align: left;
padding: 2px;
border: 1px solid #638D89;
border-left-width: 8px;
}
/*
* Sous-menus
*/
#menuprincipal ul li ul {
list-style-type: none;
position: absolute;
top: 30px;
left: 0;
}
#menuprincipal ul li ul li {
list-style-type: none;
display: inline;
}
#menuprincipal ul li ul li a {
display: block;
float: left;
border-width: 1px;
width: 117px;
}

Est-ce que vous verriez pourquoi IE affiche mal mes sous-menus ?

Merci !

Message édité par cosmoschtroumpf le 09-12-2005 à 10:35:10

---------------
Android/Manettes/Metroidvania/Zelda/Indés/Retrogaming/VDS jeux

Reply

Marsh Posté le 09-12-2005 à 10:12:03

Reply

Marsh Posté le 09-12-2005 à 10:34:56

bon laissez tomber

j'ai mis un width: 760px sur #menuprincipal ul li ul et ça marche impec

---------------
Android/Manettes/Metroidvania/Zelda/Indés/Retrogaming/VDS jeux

Reply

Problème menu déroulant [self-résolu]

Sujets relatifs:

Leave a Replay