| Re: Menu dynamique deroulant avec theme blueday |
Titre du sujet : Re: Menu dynamique deroulant avec theme blueday
par Anonyme sur 14/11/2007 01:22:18
B'soir,
Je n'ai pas vérifié, mais il me semble que dans la doc il est indiqué qu'il faut créer une feuille de style supplémentaire (tu n'en parles pas, peut être un oubli ?).
1. Tu effaces les sélecteurs qui concernent le globalnav dans la feuille style.css
2. Tu ajoutes en haut de la feuille l'instruction d'import de la nouvelle feuille dédiée au formatage des menus déroulants (nommée par exemple navigation.css)
3. Tu crées ta feuille navigation.css et l'enregistres dans le répertoire /css
Exemple de code :
/*============= Style pour l'include globalnav.html ================*/
#xo-globalnav {
height: 30px;
border: none;
background-color: transparent;
font-size: .9em;
}
* html #xo-globalnav { height: 30px; }
#xo-globalnav img {
padding: 5px 0 0 5px;
}
#xo-globalnav .x2-label {display: none;}
#xo-globalnav ul {
list-style-type: none;
}
#xo-globalnav ul li {
float: left;
position: relative;
z-index: auto !important /*Non-IE6*/;
z-index: 1000 /*IE6*/;
}
#xo-globalnav ul li a {
float: none !important /*Non-IE6*/;
float: left /*IE-6*/;
display: block;
color: #666;
height: 25px;
line-height: 2em;
padding: 0 10px 0 10px;
text-decoration: none;
font-weight: bold;
}
#xo-globalnav ul li a:hover {
color: #3366cc;
background-color: #fff !important;
font-style: normal;
text-decoration: none;
}
#xo-globalnav ul li ul {
display: none;
border: none;
margin-left: 10px;
}
/*Non-IE6 hovering*/
#xo-globalnav ul li:hover a {}
#xo-globalnav ul li:hover ul {
display: block;
width: 130px;
position: absolute;
z-index: 999;
top: 25px;
margin-top: 0em;
left: 0;
}
#xo-globalnav ul li ul li {}
#xo-globalnav ul li:hover ul li a {
display: block;
width: 130px;
height: auto;
margin-left: 0;
padding: 4px 10px 4px 10px;
border-right: 1px solid #99b3e6;
border-left: 1px solid #99b3e6;
border-bottom: 1px solid #99b3e6;
background-color: #fff;
font-weight: normal;
}
#xo-globalnav ul li:hover ul li a:hover {
color: #666;
background-color: #99b3e6 !important;
text-decoration: none;
}
/*Paramètres spécifiques pour IE6*/
#xo-globalnav table {
position: absolute;
top: -1px;
left: 0;
border-collapse: collapse;
}
#xo-globalnav ul li a:hover {
background-color: #fff;
text-decoration: none;
}
#xo-globalnav ul li a:hover ul {
display: block;
width: 90px;
position: absolute;
z-index: 999;
top: 25px;
left: 0;
margin-top: 0.1em;
}
#xo-globalnav ul li a:hover ul li a {
display: block;
width: 90px;
height: 1px;
line-height: 1.3em;
padding: 4px 10px 4px 10px;
border-right: 1px solid #99b3e6;
border-left: 1px solid #99b3e6;
border-bottom: 1px solid #99b3e6;
background-color: #fff;
font-weight: normal;
}
#xo-globalnav ul li a:hover ul li a:hover {
background-color: #99b3e6 !important;
text-decoration: none;
}
Note : je te conseille de télécharger la nouvelle archive du thème sur mon site, les 3 premiers jours il y a eu quelques cafouillages / bugs 
@+
|
|
