18041 sujets

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

Probleme menu deroulant horizontal ie6

bonjour,

j'ai mis en place un script qui permet d'afficher un menu deroulant horizontal avec sous menus.
celui ci fonctionne tres bien sous MOZILLA mais sous ie6 les sous menus n'apparaissent pas.
qui pourrait m'aider a resoudre ce probleme ou bien me communiquer un script identique qui fonctionne

CODE HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<META NAME="Description" CONTENT="Pret de bot irc, generateur de statistiques, hebergement d'images, NeryScript, Script mirc, Client irc, livre d'or, trombinoscope, tchat, rencontre, amitier, animation irc, partenaire du server irc tchattons.">
<link href="horizontal.css" rel="stylesheet" type="text/css" />
<link type="image/x-icon" rel="Shortcut Icon" href="http://groupe-nery.net/PGE/Menu/GNpuce.ico" />
<title>Groupe-NerY</title>
</head>

<body>
<div id="menu">
<ul class="niveau1">
<li><a href="http://www.hotel-lunadelsol.com/index.htm">Accueil</a></li>
<li><a href="http://www.hotel-lunadelsol.com/hotel.htm">L'H&ocirc;tel</a></li>

<li class="sousmenu"><a href="">Centre de bien-&ecirc;tre</a>
<ul class="niveau2">
<li class="sousmenu"><a href="http://www.hotel-lunadelsol.com/massage.htm">Massages</a>

<li><a href="http://www.hotel-lunadelsol.com/onglerie.htm">Onglerie</a></li>
<li class="sousmenu"><a href="http://www.hotel-lunadelsol.com/epilations.htm">Epilations</a>

</li>
<li class="sousmenu"><a href="http://www.hotel-lunadelsol.com/tresses.htm">Tresses Afros</a></li>
<li class="sousmenu"><a href="http://www.hotel-lunadelsol.com/reveilaquatique.htm">Reveil Aquatique</a></li>
</ul>
</li>
<li class="sousmenu"><a href="">Excursions</a>
<ul class="niveau2">
<li class="sousmenu"><a href="http://www.hotel-lunadelsol.com/catamarans.htm">Catamaran</a>

<li><a href="http://www.hotel-lunadelsol.com/paradise.htm">Paradise Island</a></li>
<li class="sousmenu"><a href="http://www.hotel-lunadelsol.com/oceanword.htm">Ocean World</a>

</li>
<li class="sousmenu"><a href="http://www.hotel-lunadelsol.com/safarihorse.htm">Safari Horse</a></li>
<li class="sousmenu"><a href="http://www.hotel-lunadelsol.com/camelsafari.htm">Jeep Safari</a></li>
<li class="sousmenu"><a href="http://www.hotel-lunadelsol.com/puertoplata.htm">Visite Puerto Plata</a></li>
</ul>
</li>

<li><a href="http://www.hotel-lunadelsol.com/contact.htm">Contacts</a></li>
<li><a href="http://www.hotel-lunadelsol.com/reservations.htm">Reservations</a></li>
<li><a href="http://www.hotel-lunadelsol.com/vols.htm">Vols</a></li>
<li><a href="http://www.hotel-lunadelsol.com/partenaires.htm">Partenaires</a></li>
</ul>
</div>
</body>
</html>
CODE CSS
body {behavior: url(csshover.htc);}
div#menu a {color:#FFFFFF;}
div#menu ul {padding: 0; margin:0px; background: white; text-align:center}
div#menu li {background:#3399FF;}
/* rejout couleur de fond */
div#menu li.sousmenu {background-color:#3399FF}
/* couleur qund survol avec la souris la menu pricipal */
div#menu li:hover {background: #3333FF;}
div#menu li.sousmenu:hover {background: #3333FF;}

/* rajout pr pour fleche direction bas et couleur de fond*/
div#menu li.plop { background-color:#859AD3;}

/* une petite bordure en top*/
div#menu ul li {position:relative; list-style: none; float:left; border-top:1px solid}

div#menu ul ul {position: absolute;display:none; width:100px}
div#menu li a {text-decoration: none; padding: 4px 0 4px; display:block;width:126px}
div#menu ul.niveau1 li.sousmenu:hover ul.niveau2,
div#menu ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;}

Merci de votre aide
Hello rerebubu et bienvenue sur le forum Smiley smile ,

en tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

upload/1-code.gif

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que l'Aide (dont le lien est fourni lors de l'inscription) contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Bonjour,

Un menu déroulant se fait avec du JavaScript et tu as l'exemple qui te montre pourquoi. Parce que ça ne fonctionne pas avec IE6 sinon.

En effet, IE6 ne reconnait la pseudo classe :hover que lorsqu'elle est appliquée à un lien (<a>), ce n'est pas le cas ici puisqu'elle est appliquée à <li>.

Si tu fais une recherche dans la partie apprendre, tu devrais trouver un tuto de menu déroulant utilisant Jquery.
Sujet clos
Aller à