Se connecter / S'enregistrer
Votre question

Menu en onglets déroulant

Tags :
  • CSS
  • Programmation
Dernière réponse : dans Programmation
25 Mai 2010 17:06:29

Bonjour ,

Voila , j'ai un menu en onglets et j'aimerais aussi le rendre déroulant.

Je ne trouve pas la solution .... AIDEZ-MOI SVP !
Voici le code html (je ne pense pas que vous ayiez besoin du CSS)
  1. <html>
  2. <head>
  3. <title>Les Chambres du Vignoble</title>
  4. <link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
  5.  
  6. </head>
  7. <body>
  8. <div id="menu">
  9. <ul id="onglets">
  10. <li class="active"><a href="Accueil.html"> Accueil </a></li>
  11. <li><a href="Forums.html"> Nos Chambres d'Hôtes </a></li>
  12. <li><a href="Livre_or.html"> Notre Chalet </a></li>
  13. <li><a href="Equipe.html"> Notre caveau </a></li>
  14. <li><a href="Inscription.html"> S'inscrire </a></li>
  15. <li><a href="Connexion.html"> Se connecter </a></li>
  16. </ul>
  17. </div>


Merci d'avance !

Autres pages sur : menu onglets deroulant

25 Mai 2010 17:13:21

qu'entends tu par "le rendre déroulant" ?
m
0
l
a c 232 L Programmation
25 Mai 2010 17:14:56

Salut,

Tu veux rendre quoi déroulant là ?
Tout est au même niveau.


Mais si tu veux avoir des sous-menus, ça va te donner quelque chose du genre :
  1. <html>
  2. <head>
  3. <title>Les Chambres du Vignoble</title>
  4. <link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
  5. </head>
  6. <body>
  7. <div id="menu">
  8. <ul id="onglets">
  9. <li class="active"><a href="Accueil.html"> Accueil </a></li>
  10. <li><a href="Forums.html"> Nos Chambres d'Hôtes </a>
  11. <ul>
  12. <li>Chambre 1</li>
  13. <li>Chambre 2</li>
  14. <li>Chambre 3</li>
  15. </ul>
  16. </li>
  17. <li><a href="Livre_or.html"> Notre Chalet </a>
  18. <ul>
  19. <li>Chalet 1</li>
  20. <li>Chalet 2</li>
  21. <li>Chalet 3</li>
  22. </ul>
  23. </li>
  24. <li><a href="Equipe.html"> Notre caveau </a></li>
  25. <li><a href="Inscription.html"> S'inscrire </a></li>
  26. <li><a href="Connexion.html"> Se connecter </a></li>
  27. </ul>
  28. </div>


Ensuite, il te faudra utiliser un peu de javascript pour cacher/afficher les sous menus.
Tu auras besoin des évènements onmouseover et onmouseout pour déterminer quand afficher/cacher le sous-menu. Et de mettre la propriété HTMLElement.style.display à mettre à "none" (cacher) ou "block" (afficher).
m
0
l
Contenus similaires
25 Mai 2010 17:30:00

Bonjour,

OmaR a tout dit, j'ajouterais simplement un lien vers les meilleurs tutoriels sur le HTML/CSS/JavaScript : ICI, Alsacréation (< clic)

C'est tout :o 
m
0
l
25 Mai 2010 17:33:30

sinon tu utilise des scripts tout faits comme ceux que tu trouve chez dhtmlx....
m
0
l
25 Mai 2010 17:35:15

Merci , mais maintenant avec le code html d'omaR ; il m'affiche des nombres qui sortent de je ne sais trop d'ou ...

La , faudrait m'aider ...

Ce que j'entends par déroulant, c'est un menu en onglets qui lorsqu'on passe dessus se déroule et l'on clique sur la page que l'on veut visiter.

EDIT : screen



Pour voir plus grand , cliquez !
m
0
l
25 Mai 2010 17:58:18

tu n'a quand même pas recopié les numéro de lignes dans ton code ?

si oui, supprimes les, ils ne sont la que pour se repérer !


je ne suis pas sur que tu



globalement tu veux ça ?


http://www.dhtmlx.com/docs/products/dhtmlxMenu/samples/...

si oui, télécharges-le l'utilisation peut être gratuite sous certaines conditions
m
0
l
a c 232 L Programmation
25 Mai 2010 18:09:14

Pour pouvoir copier du code sur notre site, double clique sur la portion de code.
Ca va enlever tous les numéros de ligne et tu pourras copier facilement.
m
0
l
25 Mai 2010 18:30:13

Oups ... :sarcastic: 

sinon , the_dowm , c'est ce que je cherche mais j'aimerais l'adapter à mon design ...
m
0
l
25 Mai 2010 20:11:44

UP svp , je ne veux pas vous presser mais j'en ai besoin pour dans 3 jours ....

Merci d'avance.
m
0
l
26 Mai 2010 06:58:56

UP ...
m
0
l
26 Mai 2010 08:36:06

perok68 a dit :
Oups ... :sarcastic: 

sinon , the_dowm , c'est ce que je cherche mais j'aimerais l'adapter à mon design ...



le css est la pour ça.


télécharge l'exemple (attention aux droits d'utlisation de la version gratuite) et modifie le fichier CSS fourni !
m
0
l
26 Mai 2010 13:17:37

Mais j'aimerais vraiment que vous puissiez me donner le code complet qui va avec mon css .

Merci d'avance svp .
m
0
l
26 Mai 2010 13:27:22

Le post d'Omar est complet... Que veux-tu de plus ?
m
0
l
a c 232 L Programmation
26 Mai 2010 13:54:25

Bah il veut quelque chose de tout fait tout mâché et qu'il ait pas besoin de travailler.
Juste un copier/coller et ça sera fait.
m
0
l
26 Mai 2010 14:01:52

Ah, ben alors désolé mais je peux pas je veux pas tout lui donner :p 
m
0
l
26 Mai 2010 14:11:26

pareil, et j'ai pas que ça a faire en plus.
m
0
l
26 Mai 2010 14:55:24

Bon ok désolé je vais essayer de me débrouiller, merci @+
m
0
l
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS