Javascrip pour menu deroulan sur IE6
goldfinch
Messages postés
72
Date d'inscription
Statut
Membre
Dernière intervention
-
Utilisateur anonyme -
Utilisateur anonyme -
Bonjour,
je suis nul en JavaScript du coup je cherche un script pour mon menu déroulant qui ce déroule pas sur IE6 seulement voici mon code :
<style>
#menu ul {
margin:0;
padding:0;
list-style-type:none;
text-align:center;
}
#menu li {
float:left;
margin:auto;
padding:0;
background-color:black;
}
#menu li a {
display:block;
width:100px;
color:white;
text-decoration:none;
padding:5px;
}
#menu li a:hover {
color:#FFD700;
}
#menu ul li ul {
display:none;
}
#menu ul li:hover ul {
display:block;
}
#menu li:hover ul li {
float:none;
}
#menu li ul {
position:absolute;
}
#menu {
height:50px;
}
</style>
<body>
<div id="menu">
<ul>
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a>
<ul>
<li><a href="#">Sous-item 1</a></li>
<li><a href="#">Sous-item 2</a></li>
</ul>
<li><a href="#">Sous-item 1</a>
<ul><li><a href="#">Sous-item 2</a></li>
<li><a href="#">Sous-item 2</a></li>
</ul></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 3</a></li>
</ul>
</div>
</body>
merci bien
--
Plus on découvre plus on aperçoit qu'on est bête !
je suis nul en JavaScript du coup je cherche un script pour mon menu déroulant qui ce déroule pas sur IE6 seulement voici mon code :
<style>
#menu ul {
margin:0;
padding:0;
list-style-type:none;
text-align:center;
}
#menu li {
float:left;
margin:auto;
padding:0;
background-color:black;
}
#menu li a {
display:block;
width:100px;
color:white;
text-decoration:none;
padding:5px;
}
#menu li a:hover {
color:#FFD700;
}
#menu ul li ul {
display:none;
}
#menu ul li:hover ul {
display:block;
}
#menu li:hover ul li {
float:none;
}
#menu li ul {
position:absolute;
}
#menu {
height:50px;
}
</style>
<body>
<div id="menu">
<ul>
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a>
<ul>
<li><a href="#">Sous-item 1</a></li>
<li><a href="#">Sous-item 2</a></li>
</ul>
<li><a href="#">Sous-item 1</a>
<ul><li><a href="#">Sous-item 2</a></li>
<li><a href="#">Sous-item 2</a></li>
</ul></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 3</a></li>
</ul>
</div>
</body>
merci bien
--
Plus on découvre plus on aperçoit qu'on est bête !
2 réponses
-
Salut je te donne le code que j'utilise par contre je ne pourrait pas te l'expliquer je les trouver sur le net sur le site du zéro il me semble, pour l'utiliser sur ton menu renomme ta balise <ul> en <ul id="navigation">
et ajoute ce script entre les balises <head>et</head>
<script type="text/javascript"> <!-- sfHover = function() { var sfEls = document.getElementById("navigation").getElementsByTagName("LI"); for (var i=0; i<sfEls.length; i++) { sfEls[i].onmouseover=function() { this.className+=" sfhover"; } sfEls[i].onmouseout=function() { this.className=this.className.replace(new RegExp(" sfhover\\b"), ""); } } } if (window.attachEvent) window.attachEvent("onload", sfHover); --> </script> -
un fichier javascript conçu spécialement pour cela hover.htc
et l'attribut css behaviour pour l'utiliser
