Menu déroulant

2 participants

Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Menu déroulant

Message par D.Deschamps Mar 21 Fév 2012 - 23:50

Salut a tous !

Voila, je souhaite intégrer un menu déroulant sur mon forum, donc j'ai commencer a essayer le code expliqué ici : https://forum.forumactif.com/t314485-installation-d-un-menu-deroulant#2739428.

Seulement voila, quand je passe ma souris sur une case, ca ne fait rien Sad

Quelqu'un peut m'aider ?

Voici le code que j'ai mis:
Code:

<html>

<!-- HEAD -->
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="++.css" />
<link rel="shortcut icon" href="http://img11.hostingpics.net/pics/594993viiip.jpg" type="image/x-icon" />
<title>Very Important Players</title>
</head>
<!-- /HEAD -->

<script type="text/javascript">
$(function(){ $("#menu dl").hover(function(){$("#menu dl dd").slideUp("500");$(this).find("dd").stop(true,true).slideDown("500");},function(){$(this).find("dd").slideUp("500");}); });
</script>



<div id="menu">
<dl>
<dt>Replier</dt>
</dl>
 
<dl>
<dt>Accueil</dt>
<dd  style="display:none;">
<ul>
<li><a href="http://www.ententevip.com/h1-accueil">Accueil</a></li>
<li><a href="http://www.ententevip.com/h4-video">Video</a></li>
<li><a href="http://www.ententevip.com/calendar">Calendrier</a></li>
</ul>
</dd> 
</dl>
 
<dl>
<dt>Forum VIP</dt>
<dd  style="display:none;">
<ul>
<li><a href="http://www.ententevip.com/">Forum</a></li>
<li><a href="http://www.ententevip.com/chatbox/index.forum">ChatBox</a></li>
<li><a href="http://www.ententevip.com/viewonline">QEEL</a></li>
</ul>
</dd>
</dl>
 
<dl>
<dt>Autre</dt>
<dd  style="display:none;">
<ul>
<li><a href="http://www.ententevip.com/h2-journal">Journal VIP</a></li>
<li><a href="http://www.ententevip.com/h3-staff">staff</a></li>
</ul>
</dd> 
</dl>
</div>

</html>

Voici ma feuille de style:
Code:
/*liste des menus*/
#menu ul{padding: 0px;
    list-style-type: none;
margin: 0px;
}
 
/*positionnement des menus*/
#menu dl {
    float: left;
    width: 150px;}
 
/*menus*/
#menu dt {
    color: blue;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    background: #ccc;
    border: 1px solid black;
    margin: 0px;}
 
/*menus au survol*/
#menu dt:hover{
    border-bottom: none!important;}
 
/*liste des sous-menus*/
#menu dd {
    display: none;
    border: 1px solid gray;
    border-top: none!important;
    background: #ccc;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
#menu li {
    text-align: center;
    background: grey;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
/* liens des sous-menus*/
#menu li a, #menu dt a {
    color: black;
    background: #ccc;
    text-decoration: none;
    display: block;
    height: 100%;
    border: 0 none;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
/*liens des sous-menus au survol*/
#menu li a:hover, #menu li a:focus, #menu dt a:hover, #menu dt a:focus {
    color: white;
    text-align: center;
    width: 150px;
    cursor: pointer;
    font-weight: bold;
    background: gray;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}


PS: j'essai la dernière proposition du tuto (le menu horizontal)

Merci d'avance
D.Deschamps


Dernière édition par D.Deschamps le Ven 24 Fév 2012 - 19:39, édité 1 fois
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par kheino Mer 22 Fév 2012 - 7:51

Bonjour,

Où as-tu mis ce menu ?
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Mer 22 Fév 2012 - 9:55

pour l'instant que dans mon Notepad++ pour le tester.
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par kheino Mer 22 Fév 2012 - 10:03

Dans le Notepad tu n'as pas de visualisation ?

Tu l'aimerais où ? Dans le message d'accueil ? Dans le template overall_header (sur toutes les pages), dans une page HTML ?

Si je demande, c'est parce que tu as des balises valables pour une page HTML, mais non sur le reste du forum.
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Mer 22 Fév 2012 - 10:08

dans une page html.
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par kheino Mer 22 Fév 2012 - 10:51

Ok, je te propose un menu déroulant autre que celui du tuto, que je n'ai pas le temps de tester, mais celui que j'ai a l'avantage d'être fonctionnel, que en HTML et CSS (sans js), totalement personnalisable, ainsi que de contenir (ou non si tu ne le souhaites pas) une option de sous-menus.
Code:
CODE INUTILE
Si ça te convient, installe-le et n'hésite pas à poser tes questions en cas de besoin.

Sinon, j'installerai l'autre, mais je ne sais pas quand j'en aurai le temps...


Dernière édition par Final-Blonde le Ven 24 Fév 2012 - 7:35, édité 1 fois
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Mer 22 Fév 2012 - 12:50

Je vais tout de suite voir ca Smile

Merci

Je vous tiens au courent Smile
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Mer 22 Fév 2012 - 13:39

J'ai du mal a comprendre tout ca.
Je souhaitais avoir un menu horizontal et celui-ci est vertical.

Pouvais-vous m'aider ?
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par kheino Mer 22 Fév 2012 - 13:52

Mais dans ton premier message, tu parles d'un menu vertical, non ?

Suis le tuto d?isolde que tu cites plus haut.
Il fonctionne très bien.

Si tu utilises une page HTML sans le haut et le bas du forum (= sans le CSS du forum), alors garde les mêmes balises jusqu'à l'ouverture de la balise "body".
Modifie juste les contenus "titre", CSS, JS, HTML.
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Mer 22 Fév 2012 - 14:25

voici le code que j'avais mis, et ca ne fonctionnait pas:

Code:

<html>

<script type="text/javascript">
$(function(){ $("#menu dl").hover(function(){$("#menu dl dd").slideUp("500");$(this).find("dd").stop(true,true).slideDown("500");},function(){$(this).find("dd").slideUp("500");}); });
</script>


<style>
<!--
/*liste des menus*/
#menu ul{padding: 0px;
    list-style-type: none;
margin: 0px;
}
 
/*positionnement des menus*/
#menu dl {
    float: left;
    width: 150px;}
 
/*menus*/
#menu dt {
    color: blue;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    background: #ccc;
    border: 1px solid black;
    margin: 0px;}
 
/*menus au survol*/
#menu dt:hover{
    border-bottom: none!important;}
 
/*liste des sous-menus*/
#menu dd {
    display: none;
    border: 1px solid gray;
    border-top: none!important;
    background: #ccc;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
#menu li {
    text-align: center;
    background: grey;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
/* liens des sous-menus*/
#menu li a, #menu dt a {
    color: black;
    background: #ccc;
    text-decoration: none;
    display: block;
    height: 100%;
    border: 0 none;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
/*liens des sous-menus au survol*/
#menu li a:hover, #menu li a:focus, #menu dt a:hover, #menu dt a:focus {
    color: white;
    text-align: center;
    width: 150px;
    cursor: pointer;
    font-weight: bold;
    background: gray;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
   -->
</style>


<div id="menu">
<dl>
<dt>Replier</dt>
</dl>
 
<dl>
<dt>Menu 1</dt>
<dd  style="display:none;">
<ul>
<li><a href="http://www.ententevip.com/t1233-presentation-de-l-entente">Presentation de L'entente</a></li>
<li><a href="http://www.ententevip.com/t1126-charte-de-l-entente">Charte de L'entente</a></li>
<li><a href="http://www.ententevip.com/t1264-les-membres-vip">Membres de l'entente</a></li>
</ul>
</dd> 
</dl>
 
<dl>
<dt>Menu 2</dt>
<dd  style="display:none;">
<ul>
<li><a href="http://www.ententevip.com/t1266-le-maillot-vip">Maillot de l'entente</a></li>
<li><a href="http://ententevip.forumactif.fr/h4-video">Video de l'entente</a></li>
<li><a href="http://ententevip.forumactif.fr/memberlist?mode=overall_posters">Meilleurs posteurs du forum</a></li>
<li><a href="http://www.virtuafoot.com/#entente?eid=1811" target="_blank">Entente</a>
<li><a href="http://www.virtuafoot.com/#matchs?entente=1811" target="_blank">I-E de l'entente</a></li>
<li><a href="http://www.virtuafoot.com/#entente?selection=1811" target="_blank">Selection</a></li>
</ul>
</dd>
</dl>
 
<dl>
<dt>Menu 3</dt>
<dd  style="display:none;">
<ul>
<li><a href="url-de-renvoi">Sous-Menu 3.1</a></li>
<li><a href="url-de-renvoi">Sous-Menu 3.2</a></li>
</ul>
</dd> 
</dl>
</div>

</html>
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par kheino Mer 22 Fév 2012 - 14:50

Je te disais de garder les balises du head, change juste le titre .

Code:
<!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" />
<title>Titre de la page HTML</title>

<style type="text/css" media="all">
/*liste des menus*/
#menu ul{padding: 0px;
    list-style-type: none;
margin: 0px;
}
 
/*positionnement des menus*/
#menu dl {
    float: left;
    width: 150px;}
 
/*menus*/
#menu dt {
    color: blue;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    background: #ccc;
    border: 1px solid black;
    margin: 0px;}
 
/*menus au survol*/
#menu dt:hover{
    border-bottom: none!important;}
 
/*liste des sous-menus*/
#menu dd {
    display: none;
    border: 1px solid gray;
    border-top: none!important;
    background: #ccc;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
#menu li {
    text-align: center;
    background: grey;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
/* liens des sous-menus*/
#menu li a, #menu dt a {
    color: black;
    background: #ccc;
    text-decoration: none;
    display: block;
    height: 100%;
    border: 0 none;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
/*liens des sous-menus au survol*/
#menu li a:hover, #menu li a:focus, #menu dt a:hover, #menu dt a:focus {
    color: white;
    text-align: center;
    width: 150px;
    cursor: pointer;
    font-weight: bold;
    background: gray;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
</style>

<script type="text/javascript">
$(function(){ $("#menu dl").hover(function(){$("#menu dl dd").slideUp("500");$(this).find("dd").stop(true,true).slideDown("500");},function(){$(this).find("dd").slideUp("500");}); });
</script>
</head>

<body>

<div id="menu">
<dl>
<dt>Replier</dt>
</dl>
 
<dl>
<dt>Menu 1</dt>
<dd  style="display:none;">
<ul>
<li><a href="url-de-renvoi">Sous-Menu 1.1</a></li>
<li><a href="url-de-renvoi">Sous-Menu 1.2</a></li>
<li><a href="url-de-renvoi">Sous-Menu 1.3</a></li>
</ul>
</dd> 
</dl>
 
<dl>
<dt>Menu 2</dt>
<dd  style="display:none;">
<ul>
<li><a href="url-de-renvoi">Sous-Menu 2.1</a></li>
<li><a href="url-de-renvoi">Sous-Menu 2.2</a></li>
<li><a href="url-de-renvoi">Sous-Menu 2.3</a></li>
<li><a href="url-de-renvoi">Sous-Menu 2.4</a></li>
<li><a href="url-de-renvoi">Sous-Menu 2.5</a></li>
<li><a href="url-de-renvoi">Sous-Menu 2.6</a></li>
</ul>
</dd>
</dl>
 
<dl>
<dt>Menu 3</dt>
<dd  style="display:none;">
<ul>
<li><a href="url-de-renvoi">Sous-Menu 3.1</a></li>
<li><a href="url-de-renvoi">Sous-Menu 3.2</a></li>
</ul>
</dd> 
</dl>
</div>

</body>
</html>
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Mer 22 Fév 2012 - 15:13

Oui, mais quand je passe ma souris dessus, il n'y a pas de sous menus qui s'affichent Sad
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par kheino Mer 22 Fév 2012 - 16:03

Moui, je viens de e le constater aussi en le mettant dans une page HTML.
Pourtant sur le forum, le script fonctionne.

Là je ne sais pas comment résoudre ceci, vu que je m'y connais pas suffisamment en JS car il me semble que c'est ce qui coince. Grrr



EDIT : Tu peux essayer ce menu horizontal qui est du même acabit que le premier vertical que je t'avais donné, rien qu'en CSS et en HTML avec une option de sous-sous-menus:
Code:
CODE INUTILE


Dernière édition par Final-Blonde le Ven 24 Fév 2012 - 7:34, édité 1 fois
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Mer 22 Fév 2012 - 17:15

j'aime beaucoup de menu, mais j'aurais souhaité le modifier un petit peu...

est-il possible de mettre une image de fond dans les cases ?

et de séparer les cases par un trait ou un petit espace ?


Voici la barre de navigation que j'ai actuellement sur la page:
Code:
<! DOCTYPE html>
<html>

<!-- HEAD -->
<head>
<meta charset="utf-8" />
</head>

<style>
body {
background: #00000F;
}
a{text-decoration: none !important; /* text non souligné */
}
p {
color: black; /* couleur des textes qui ont comme balise <p> / couleur-noir */
}
.bbd {
background-image: url(http://theme.webme.com/designs/iceblue/images/button.gif); /* fond des icones de barre de navigation */
background-repeat: none; /* pas de répétition de l'image */
height: 32px; /* hauteur de l'image */
width: 184px; /* largeur de l'image */
padding-left: 24px; /* emplacement du texte sur l'image (a 24px de la gauche) */
font-family:tahoma, verdana, arial; /* police du texte des icones de barre de navigation */
font-size:10px; /* taille de la police du texte des icones de barre de navigation */
}
.lefty { /* bordure vert: haut gauche arrondit / haut droite carré / gauche / droite / bas: nul */
khtml-border-radius-topleft: 20px;
khtml-border-radius-topright: 20px;
moz-border-radius-topleft: 20px;
moz-border-radius-topright: 20px;
webkit-border-top-left-radius: 20px;
webkit-border-top-right-radius: 20px;
border-top-left-radius: 20px;
border : 2px solid #238E23; /* bordure : largeur-2px / couleur-vert */
border-bottom: 0px; /* bas nul */
}
.bas { /* bordure vert: soulignement (haut / gauche / droite : nul) */
khtml-border-radius-topleft: 20px;
khtml-border-radius-topright: 20px;
moz-border-radius-topleft: 20px;
moz-border-radius-topright: 20px;
webkit-border-top-left-radius: 20px;
webkit-border-top-right-radius: 20px;
border-top: 0px ; /* haut nul */
border-left: 0px ; /* gauche nul */
border-right: 0px ; /* droite nul */
border-bottom: 2px solid #238E23; /* bordure bas: largeur-2px / couleur-vert */
}
</style>
<!-- /HEAD -->

<!-- NAVIG -->
<table width=75% class=bas cellspacing=0>
<tr>
<td><div align=center>
<table width=75% rowspan=0 cellspacing=2 cellpadding=0 border=0 align=center class="lefty">
<tr>
<td width=100% height="30">
<table width="100% border=1 cellspacing="0" cellpadding="0">
<tr>
<td class="bbd"><a href="http://ententevip.forumactif.fr/h1-accueil"><p><font color="#FF0000"><b>Accueil</b></font></p></a></td>
<td class="bbd"><a href="http://ententeom.forumactif.fr/"><p><b>Forum VIP</b></p></a></td>
<td class="bbd"><a href="http://ententevip.forumactif.fr/h2-journal"><p>Journal VIP</p></a></td>
<td class="bbd"><a href="http://ententevip.forumactif.fr/h3-staff"><p>Staff de l'entente</p></a></td>
<td class="bbd"><a href="http://www.ententevip.com/calendar"><p>Calendrier VIP</p></a></td>
</tr> 
</table> 
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
<!-- /NAVIG -->

J'aurais aimé garder le même "design" et juste rajouter des sous menu au survol de la souris.

Est-possible ?

Merci
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par kheino Mer 22 Fév 2012 - 17:40

Je ne sais pas quel menu tu as choisis.
C'est lequel ?

J'avoue n'avoir pas vraiment le temps de regarder tout le code en détail.
Si c'est le menu que je t'ai donné, il fonctionne par le hover.
Si tu as juste créer un menu en tableau, c'est plus compliqué que ça pour le faire se dérouler par le hover, en tout les cas, il ne te renverra pas à une page par le hover, là il faut le clic.

Attention, ta page doit se fermer par les balises .
Code:
</body>
</html>
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Mer 22 Fév 2012 - 18:28

ok, et avec le clic c'est possible alors ?
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Jeu 23 Fév 2012 - 19:36

bon, si on ne peut pas mettre d'image de fond, tant pis.

Mais est-ce que on peut au moins séparer un peu chaque cases ?
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Jeu 23 Fév 2012 - 20:36

c'est bon j'ai trouvé comment on fait pour le bord Smile
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Jeu 23 Fév 2012 - 20:43

serait-il possible d'arrondir un côté ?
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Jeu 23 Fév 2012 - 22:28

Voila ! j'ai réussit a en faire quelque chose de très sympathique Smile

Avec une image de fond et tout Smile

voici comment j'ai arrangé le css:

Code:

body {
behavior: url(csshover.htc);
}
div#menu a {
color:#000000;
font-size:12;
}
div#menu ul {
padding: 0;
margin:0px;
}
div#menu li {
background-image: url("http://theme.webme.com/designs/iceblue/images/button.gif"); /* image de fond sans passage de souris */
}
div#menu li:hover { /* fond passage de souris */
background-image: url(http://www.cadeau.ci/shops/images/P/Basin-Moins-Riche-Vert-Claire-%286%29-detail.jpg);
}
div#menu li.sousmenu:hover { /*fond passage de souris */
background-image: url(http://www.cadeau.ci/shops/images/P/Basin-Moins-Riche-Vert-Claire-%286%29-detail.jpg);
}

/* rajout couleur de fond */
div#menu li.sousmenu {
background-image: url("http://theme.webme.com/designs/iceblue/images/button.gif"); /* image de fond sans passage de souris */
}

/* bordure */
div#menu ul li {
position:relative;
list-style: none;
float:left;
border:1px solid;
}
 
div#menu ul ul {
position: absolute;
display:none;
}
div#menu li a {
text-decoration: none;
padding: 4px 0px; /* hauteur et largeur de la case */
display:block;
width:110px;
height:20px;
padding-left:24px;
padding-top:8px; /* a combien de px de la gauche le texte doit commencer */
}
div#menu ul.niveau1 li.sousmenu:hover ul.niveau2,
div#menu ul.niveau2 li.sousmenu:hover ul.niveau3 {
display:block;
}
 
/*(niveau 3 inutile pour le moment) */
div#menu ul.niveau3 li { /* fond sans passage de souris */
background: #99cccc
}
div#menu ul.niveau3 li:hover { /* fond au passage de souris */
background: #99cc00
}
div#menu ul.niveau3 {
top:-1px; left: 100px;
}

Vous en pensez quoi ?
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par kheino Ven 24 Fév 2012 - 7:32

Si tu es satisfait cêst ce qui compte.
Bravo et bonne continuation. sunny
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant

Message par D.Deschamps Ven 24 Fév 2012 - 16:41

merci je met l'icone résolu
D.Deschamps

D.Deschamps
****

Masculin
Messages : 356
Inscrit(e) le : 26/04/2011

http://ententekillersdevf.forum-actif.net/
D.Deschamps a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum