Pb Creation un sous Menu en CSS !

**wormseric** · 22/08/2006, 14h20

Bonjour,

Je voulais savoir comment je pourrais creer un sous menu avec du html et du css. J'ai regarder plusieur site avec des exemples , mais je n'arrive pas à reproduire le menu que je voudrais.

Dans l'image ci dessous, j'ai reussi à creer la barre du haut du menu. Maintenant je voudrais savoir comment je pourrais creer la barre du bas.
Je veux que lorsque un utilisateur va sur le menu avec la souris, qu'un sous menu apparaisse sous le menu principale, comme dans le lien ci-dessous.

Mon fichier css

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
#navbar_ex4 {
    background-color: #426208;
    float: left;
    width: 700px;
}
 
#navbar_ex4 ul {
    color: #FFFFFF;
    font-family: tahoma, verdana, geneva, arial, sans-serif;
    font-weight: bold;
    letter-spacing: 2px;
    margin: 0;
    padding: 0 0 0 7%;
}
 
#navbar_ex4 ul li {
    display: inline;
}
 
#navbar_ex4 a {
    background-color: #426208;
    border-right: 1px solid #94B473;
    color: #FFFFFF;
    float: left;
    padding: 0.2em 12px;
    text-decoration: none;
}
 
#navbar_ex4 a:hover {
    background-color: #7B9D25;
 
    color: #FFFFFF;
}

Ma page html

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
<div id="navbar_ex4">
  <ul>
    <li><a href="#">Exemple 4</a></li>
    <li><a href="#">Lien 2</a></li>
    <li><a href="#">Lien 3</a></li>
    <li><a href="#">Lien 4</a></li>
 
    <li><a href="#">Lien 5</a></li>
    <li><a href="#">Lien 6</a></li>
  </ul>
</div>

Je vous remercie d'avance !

**raptor70** · 22/08/2006, 14h26

http://web.developpez.com/tutoriel/x...uderoulantcss/

par contre ce n'est compatible qu'avec FF, pour une compatibilité avec IE, il faut utiliser du JavaScript

**wormseric** · 22/08/2006, 14h31

Oups desole, j'ai oublier de precicer que mon menu doit etre comptatible avec ie et ff

**raptor70** · 22/08/2006, 14h37

La seule solution : Javascript

**speedev** · 22/08/2006, 15h42

ton menu peut-être compatible tout navigateur avec du css et html pour la simple raison que tous mes menus sont faits ainsi et tous compatibles!

Le tutoriel n'est compatible qu'avec Mozilla car les images sont transparentes...et IE ne gère pas la transparence partielle, il te suffit de ne pas mettre d'image et d'arranger un peu le code.
ou alors tu utilises des onmouseover et onmouseout pour afficher les sous menu mais ne va pas faire une menu tout en javascript...c'est lourd et vilain je trouve moi...