Menu déroulant

Résolu
mailou Messages postés 488 Date d'inscription   Statut Membre Dernière intervention   -  
mailou Messages postés 488 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,
J'ai actuellement un menu horizontal que voici 

<B_nav>
<div class="nav clearfix[ (#TOTAL_BOUCLE|=={1}|oui)none]" id="nav">
	<ul>
		<BOUCLE_nav(RUBRIQUES) {racine} {par num titre, titre}{titre_mot=menucentre} {0,8}>
		<li[ class="(#EXPOSE)"]><a href="#URL_RUBRIQUE">#TITRE</a></li>
		</BOUCLE_nav>
	</ul>
</div>
</B_nav>


Et mon rêve est de le convertir en menu déroulant en passant la souris dessus, pour le css c'est ça 

.formulaire_menu_lang { position: absolute; right: 0; top: .9em; display: block; width: 30%; }

.nav { border: solid #222; border-width: 1px 0; }
.nav ul {}
.nav ul li {}
.nav ul li a { float: left; display: block; padding: .5em 1em; border-right: 1px solid #222; text-decoration: none; }
.nav ul li.on a { background: #EED; color: #222; font-weight: normal; }
.nav ul li a:focus,
.nav ul li a:hover,
.nav ul li a:active { background: #222; color: #FFF; }


Pourrais-je avoir de l'aide,
Merci



A voir également:

5 réponses

Réponse 1 / 5
cubeur78 Messages postés 98 Date d'inscription   Statut Membre Dernière intervention   65
 
Pourrai t-on avoir un exemple en lien ?
Cherche tu as faire un menu comme cela http://www.frogweb.fr/menu-deroulant-horizontal/ ?
0
Réponse 2 / 5
mailou Messages postés 488 Date d'inscription   Statut Membre Dernière intervention   13
 
Bonjour, 
Pourrai t-on avoir un exemple en lien ?
Non le site est en local, j'ai légèrement avancé mais légèrement, 
<B_nav>
<div class="nav clearfix[ (#TOTAL_BOUCLE|=={1}|oui)none]" id="nav">
 <ul>
 <BOUCLE_nav(RUBRIQUES) {racine} {par num titre, titre}{titre_mot=menucentre} {0,8}>
 <li[ class="(#EXPOSE)"]><a href="#URL_RUBRIQUE">#TITRE</a>

                <B_sous_rubriques>
                <ul>
                 <BOUCLE_sous_rubriques(RUBRIQUES) {id_parent} {par num titre, date}{par titre}>
  <li[ class="(#EXPOSE)"]><a href="#URL_RUBRIQUE">#SOUSTITRE</a>
                <BOUCLE_sousmenu(boucle_sous_rubriques)></BOUCLE_sousmenu>
                </li>
  </BOUCLE_sous_rubriques>
                </ul>
                </B_sous_rubriques> 

    </li> 
                </BOUCLE_nav>
 </ul>
</div>
</B_nav>


Je butte sur le css, le menu apparaît mais il ne se déroule pas 

Cherche tu as faire un menu comme cela http://www.frogweb.fr/menu-deroulant-horizontal/ ?


oui à peu prés çà,
Je crois avoir déjà vu
Merci
0
cubeur78 Messages postés 98 Date d'inscription   Statut Membre Dernière intervention   65
 
Si c'est ce que tu veux faire, suis le tutoriel. Tu trouvera surêment de l'aide pour ton CSS.
0
Réponse 3 / 5
mailou Messages postés 488 Date d'inscription   Statut Membre Dernière intervention   13
 
Encore ce matin je l'ai entièrement passé la dessus j'ai donc posé la question sur le site du zero:

https://openclassrooms.com/forum/sujet/la-brouille
j'attends voir ce que je vais avoir comme conseil
Merci
@+
0
Réponse 4 / 5
Nacim59 Messages postés 22 Date d'inscription   Statut Membre Dernière intervention  
 
Bonjour,

j'ai réalisé un site il y a pas longtemp , adapte juste le code HTML

Code HTML

<div id="menu">
<ul>
<li>
<a href="accueil.html" class="bordureG">Accueil</a></li>
</ul>

<ul>
<li>
<a href="#">Recettes</a>
<ul>
<li><a href="boeuf.html">Boeuf</a></li>
<li><a href="agneau.html">Agneau</a></li>
<li><a href="fruits de mer.html">Fruits de mer</a></li>
<li><a href="volaille.html">Volaille</a></li>
<li><a href="Sucree.html">Sucrée</a></li>
</ul>
</li>
</ul>

<ul>
<li>
<a href="#">Recettes video</a>
<ul>
<li><a href="fried rice.html">Fried Rice</a></li>
<li><a href="poulet tandoori.html">Poulet Tandoori</a></li>

</ul>
</ul>

<ul>
<li>
<a href="index.html">Déconnexion</a>
<ul>


</ul>
</li>
</ul>
</div>

Code CSS

/*menu*/

#menu
{
margin-top:-4%;
width:100%;
height:60px;
background:#d17a82;
COLOR:#ffffff;
}

#menu ul

{
margin-left:175px;
padding:0;
line-height:60px;


}

#menu li

{
list-style:none;
float:left;
position:relative;
background-color:#3f0508;


}

#menu ul li a

{
color:#000;
text-decoration:none;
width:150px;
height:60px;
display:block;
text-align:center;
border-right:1px solid #ffffff;
COLOR:#ffffff;

}

.bordureG{
border-left:1px solid #ffffff;

}

#menu ul ul

{
position:absolute;
top:60px;
left:-175PX;
visibility:hidden;

}

#menu ul li{
border-bottom:1px solid #ffffff;
border-top:1px solid #ffffff;

}


#menu ul li:hover ul

{

visibility:visible;

}

#menu li:hover

{
background-color:#8f4349;
}

#menu ul li ul a:hover

{
color:#fff;
background-color:#8f4349;
}


Cordialement
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 5
mailou Messages postés 488 Date d'inscription   Statut Membre Dernière intervention   13
 
Bonjour,
Depuis, j'ai solutionné, mais je garde ta proposition sous le coude,
Merci
0

Discussions similaires

Suppression listes déroulantes
Archa -
Sam -

5 réponses
Supprimer liste déroulante Excel
SamAlex -
b@bd -

8 réponses
Effacer liste déroulante
gabrielle -
jmps -

3 réponses
menu caché
laurent -
ChariduP -

7 réponses
supprimer une liste déroulante
fred94 -
m@rina -

3 réponses