High-Tech Santé Médecine Droit-Finances

Grippe A

Que dois-je faire ?

Rechercher : dans
Par :

Comment faire un menu déroulant en HTML?

Dernière réponse le 30 oct 2009 à 23:35:50 Yakurena, le 14 fév 2005 à 22:03:57 
 Signaler ce message aux modérateurs

Bonsoir,
J'aimerais savoir s'il est possible de faire un menu déroulant sans avoir recours au DHTML(langage que je ne connais pas du tout),mais simplement avec du HTML(ou à la rigueur du PHP).
Merci d'avance.

Posez votre question Répondre

1

trik59, le 14 fév 2005 à 23:13:33
  • +1

Voili voilou !!
je croi que c'est ce que tu cherche nen ?


<select name="liste">
<option value="Choix 1">Choix 1
<option value="Choix 2">Choix 2
<option value="Choix 3">Choix 3
</select>

a+

   
Répondre à trik59

2

Yakurena, le 14 fév 2005 à 23:48:52

Non,c'est plus compliqué que ça...
En fait,ce que j'appelle un menu déroulant,c'est avoir au départ un menu du genre :
A
B
C
et en cliquant sur une des 3 options,un sous-menu apparaitrait ; par exemple,en cliquant sur B :
A
B
B1
B2
B3
C

Voilà ce que j'aimerais obtenir...

   
Répondre à Yakurena

38

getthoballer, le 24 jan 2009 à 21:28:09

Bonjour!, je sais que maintenant on n'est en 2009 et que sa fait 4 ans que tu as ecrit sa mais comment tu fais pour que sa marche.. ex:

<select name="list">
<option value="Choix 1">Choix 1
<option value="Choix 2">Choix 2
<option value="Choix 3">Choix 3
</select>


mais moi je veux que quand on choisit un choix sa nous amene a un autre page merci de ta reponse le plus tot possible ;)

   
Répondre à getthoballer

3

liad, le 15 fév 2005 à 08:13:10

En partant d'une structure HTML valide tel que:

<ul>
<li>Mon option</li>
<li>Mon option 2
<ul>
<li>déroulant 1</li>
<li>déroulant 2</li>
</ul>
</li>
</ul>

Tu obtiens un menu que les moteurs de recherches référencent facilement, et que tous les navigateurs pourront lire (y-compris ton natel :) .

Pour lui faire faire ce que tu veux graphiquement, utilise une feuille de style CSS. De nombreux exemple sont disponible sur cette page.

http://css.maxdesign.com.au/listamatic/

   
Répondre à liad

4

ad_creative, le 15 fév 2005 à 08:27:58
  • +3

Salut ..

voici un debut de réponse .. c'est très propre mais bon ..

// ------------------------------------------------------------­--

<html>
<head>
<title>TEST</title>
</head>

<body bgcolor="#FFFFFF">


<SCRIPT LANGUAGE="JavaScript">

var txt=new Array () ;

txt[1]='<a href="page1.htm">test1</a><br><a href="page4.htm">test2</a>';
txt[2]='<a href="page2.htm">test3</a><br><a href="page5.htm">test4</a>';
txt[3]='<a href="page3.htm">test5</a><br><a href="page6.htm">test6</a>';

function menu(id)
{
ref=document.getElementById(id);
if (ref.innerHTML== "....")
ref.innerHTML = txt[id];
else
ref.innerHTML= "....";
}

</SCRIPT>

<a href=# onClick="menu(1);">menu1</a>
<DIV id=1>....</DIV>

<a href=# onClick="menu(2);">menu2</a>
<DIV id=2>....</DIV>

<a href=# onClick="menu(3);">menu3</a>
<DIV id=3>....</DIV>


</body></html>

//-------------------------------------------------------------------

exemple ici : http://adcomp.no-ip.org/mp3.php

@+

   
Répondre à ad_creative

12

benoit, le 4 oct 2007 à 14:26:17

C'est tout à fait ce que je cherchais !!!

Est-ce qu'il y a un moyen simple pour que txt[1] se referme quand on ouvre txt[2] (et réciproquement) ?

Merci.

   
Répondre à benoit

28

azerwhite, le 17 nov 2008 à 14:39:21

Mon dieu pas en javascript, certain le désactive vaut mieux le faire en CSS

   
Répondre à azerwhite

46

koribial, le 13 aoû 2009 à 10:12:38

Salut!
ton code est super et très utile pour les menus déroulants, mais même en cherchant je n'ai pas réussi à faire en sorte que les liens soient "côte à côte"...
je m'explique...
j'aimerais faire mon menu à l'horizontale, sous ma bannière...
donc le fait que les chois dits "déroulés" se déroulent vers le bas est très bien adapté, par contre les 3 catégoriesprincipales sont d'origine les unes sur les autres...
si tu pouvais me répondre par mail au plus vite stp ce serait sympa de ta part.
Merci d'avance,
Koribial

   
Répondre à koribial

5

domi, le 31 mar 2005 à 16:05:05
  • +3

Voici un exemple de liste déroulante dynamique en html et Javascript (j'ai enlevé toutes les décalrations de doctype, css...). En fonction du choix dans une première liste, unes seconde liste est générée automatiquement
Bon courage
P.S. Si cela ne répond pas à votre problème j'ai d'autres solutions possibles


<html>
<title>liste déroulante dynamique</title>
<head>
<script language="Javascript" type="text/javascript" >
function choix(formulaire)
{
var j;
var i = formulaire.boite1.selectedIndex;
if (i == 0)
for(j = 1; j <3; j++)
formulaire.boite2.options[j].text="";


else{
switch (i){
case 1 : var text = new Array( "Marseille","PSG","Monaco");
break;
case 2 : var text = new Array("Toulouse","Agen","Paris");
break;

case 3 : var text = new Array("Dijon","Pau","Gravelines");
break;
}

for(j = 0; j<3; j++)
formulaire.boite2.options[j+1].text=text[j];
}
formulaire.boite2.selectedIndex=0;
}
</script>
</head>
<body>
<form name="formulaire">
<select name="boite1" onChange="choix(this.form)">
<option selected>...........Choisissez une rubrique...........</option>
<option>foot</option>
<option>rugby</option>
<option>basket</option>

</select>

<select name="boite2">
<option selected>...........Choisissez une rubrique...........</option>
<option></option>
<option></option>
<option></option>
</form>
</select>
</body>
</html>

   
Répondre à domi

6

Bloodman, le 12 avr 2005 à 13:55:05

Comment ont fait pour changer de page en selectionnant un mot qui est dans le menu deroulant stp ?

   
Répondre à Bloodman

7

kij_82, le 12 avr 2005 à 15:31:43

Tu met un lien à a place d'un mot simple.

++

   
Répondre à kij_82

43

strale, le 13 mai 2009 à 17:01:54

Peux-tu donner un exemple pour mettre le lien à la place du text ? merci

   
Répondre à strale

48

Denis, le 1 oct 2009 à 21:29:00

Bonsoir
je n'arrive pas à ouvrir une page internet avec les boites.
Comment faire?
Merci
Denis

   
Répondre à Denis

50

 frodolon, le 30 oct 2009 à 23:35:50

Merci ton message ma ete tres utile
pourrai tu me donner un cours sur les menu deroulant avec interaction entre les menu
je suis sur un projet qui reposera sur le html mais sur peut de fonction
les liens, les renvoi, les mise en memoire(je ne sais pâs si c possible) les menu deroulant
pourrai tu maider
merci

   
Répondre à frodolon

8

Bloodman, le 12 avr 2005 à 19:38:51

Dsl mais j'y arrive pas
je voudrai un menu deroulant qui quand je clique sur le mot index(qui est dans le mot deroulant) m'amene a la page index.html(dans le meme dossier bien sur)

   
Répondre à Bloodman

44

strale, le 13 mai 2009 à 17:05:07

Je n'y arrive pas non plus. Je ne trouve pas le script à insérer pour accéder à un lien hypertext à partir du second menu. Depuis le temps, quelqu'un a-t-il trouvé la solution ? merci de votre aide.

   
Répondre à strale

9

rem, le 15 mar 2007 à 17:27:23

Salut a tous g un probleme jutilise le logiciel nvu pour créer mon site et je voudrai mettre un menu horizontal et vertical et kan je met "code html" il me mé les écrits mais non pas le menu en couleur !! aidez moi svp merciiii davancee !!!! ( ou alors si personne ne pe maider, conseillé moi un logiciel mieux ).

   
Répondre à rem

10

Dalida, le 15 mar 2007 à 19:13:51
  • +4

Salut,

à ce niveau là le meilleur conseil que tu puisses recevoir c'est de te documenter !
en premier tu devrais lire ça.
;o)
[ Mathieu ]
savoir rester faignant, c'est progresser en informatique. enfin, j'essaie...

   
Répondre à Dalida

11

Scandaleuz, le 4 jui 2007 à 10:10:20
  • +1

Salut !!

Moi j'ai quelques questions à rajouter ...
- D'abord vous proposez 2 boites, mais il m'en faudrait 4 ... Chacune liée à la réponse de la précédente ... Quel est le code que je dois entrer ?
- Ensuite dans certaines listes j'ai 9 éléments et 31 dans la liste d'après ... Est ce qu'il est possible que la taille de la liste s'adapte au nombre d'éléments qu'elle contient ? (Sans rentrer "-" pour les éléments à rajouter !!!)


Merci ...

   
Répondre à Scandaleuz

17

qpo, le 29 oct 2008 à 14:19:31
  • +2

Tu devrais utiliser Notepad++

   
Répondre à qpo

13

leila, le 2 mar 2008 à 18:52:36

Bonsoir,

je viens de créer un blog et j'ai besoin d'un tableau avec colonnes et lignes pour pourvoir integrer des photos

pouviez me donner le code html pour pourvoir creer ce tableau

merci d'avance

leila

   
Répondre à leila

14

Dalida, le 2 mar 2008 à 20:11:54
  • +2

Salut,

et qu'est-ce que ta question vient faire à la fin d'une discussion sur les menus déroulants ?
-:oD

pour ta question, as-tu pensé à le faire en CSS ?

regarde cette galerie. tu ne veux peut être pas afficher la grande image mais positionner des images c'est fait !
et tu peux remonter dans la liste, il y en a plein d'autres. pour présenter des images ça peut donner des idées !
-;o)

[ Mathieu ]
« On embauchera plus s'il est moins compliqué de licencier. » LP, 29 août 2007.

   
Répondre à Dalida

15

BartWadela, le 2 mar 2008 à 23:24:58
   
Répondre à BartWadela

18

InAme19, le 29 oct 2008 à 14:32:01

En fait tu veux faire un menu accordeon?

va voir là:
les explications: http://css.alsacreations.com/...

l'exemple : http://css.alsacreations.com/xmedia/exemples/accordeon/menu_­demo.html

   
Répondre à InAme19

19

riridi, le 1 nov 2008 à 12:20:39
  • +2

Le sauveur a la rescousse tadadada!!!!!!!


voici le code (html/css) :


CSS :


#menu ul {
margin:0;
padding:0;
list-style-type:none;
text-align:center;
}
#menu li {
float:left;
margin:auto;
padding:0;
background-color:#00008b;
}
#menu li a {
display:block;
width:100px;
color:white;
text-decoration:none;
padding:5px;
}
#menu li a:hover {
color:#FFD700;
}
#menu ul li ul {
display:none;
}
#menu ul li:hover ul {
display:block;
}
#menu li:hover ul li {
float:none;
}
#menu li ul {
position:absolute;
}
#menu {
height:50px;
}






xHTML:


<div id="menu">
<ul>
<li><a href="index.html">Accueil</a></li>
<li><a href="#">Contacte</a>
<li><a href="#">Membre</a>
<ul>
<li><a href="#">Connexion</a></li>
<li><a href="#">Inscription</a></li>
</ul>
<li><a href="#">Astuces</a>
<ul>
<li><a href="#">Windows XP</a>
<li><a href="#">Windows Vista</a>
<li><a href="#">Internet Explorer</a>
</ul>
</ul>
</div>








ps : marche pas sur ie6 (ie7 je c'est pas) et mozilla sa marche

   
Répondre à riridi

36

benylerikiki, le 20 jan 2009 à 15:12:28

Je te dis markiiii aussi mais avec du retard, mais bon mieu motard que jamais :) ... '-_- oulala ça va pas moi jvé arrêter le HTML ça me réussit pas du tout ;) .... Bon allez une dernière .... si vous avez soif on va à l'épicerie du coin pour HTML .... (soupir) bon ben je vais aller me pendre là ! ^^

Bonne journée et encore merci :)

   
Répondre à benylerikiki

20

riridi, le 2 nov 2008 à 13:24:02

Personne ??

   
Répondre à riridi

21

BartWadela, le 2 nov 2008 à 14:04:33

Yakurena dis merde ou merci mais répond quoi !!!

   
Répondre à BartWadela

22

Fred, le 4 nov 2008 à 16:46:58

Ben moi je dis merciiiiiiiiiiiiiiiiiiiii :o)

   
Répondre à Fred

23

BartWadela, le 5 nov 2008 à 09:38:16

;)

   
Répondre à BartWadela

24

riridi, le 16 nov 2008 à 13:34:46

XD yen a un qui pense a moi au moin
mais franchement la politesse sa s'apprend

   
Répondre à riridi

25

riridi, le 16 nov 2008 à 16:13:01

Je t'ai édais fred ??

   
Répondre à riridi

27

Fred, le 17 nov 2008 à 13:52:27
  • +1

Oui beaucoup !! C'est la base dont j'avais besoin, après j'ai juste fait la mise en forme avec mon fichier css et maintenant c'est tout niquel !!! Il me manque plus que le contenu du site :o) !! lol

   
Répondre à Fred

26

web-actu, le 16 nov 2008 à 16:22:52

Suis plus anonyme
et j'étais riridi

   
Répondre à web-actu

29

Atomics, le 25 nov 2008 à 14:10:02

Bonjour,

Le dernier code fonctionne très bien et c'est ce que je recherchai moi même pour mon site, néanmoins je le souhaiterai de manière verticale :

Comme ceci

MENU1----->sousmenu1
MENU2 sousmenu2
MENU3
MENU4
MENU5

Quelqu'un pourrai me dire qu'est ce qu'il y'a à modifier sur ce code pour obtenir un menu comme celui ci s'il vous plais?

Merci beaucoup

   
Répondre à Atomics

30

Toinou, le 30 nov 2008 à 17:31:16
   
Répondre à Toinou

31

atomics, le 1 déc 2008 à 09:47:01

Merci beaucoup :)

   
Répondre à atomics

32

web-actu, le 9 déc 2008 à 17:02:44

Il a duré 3 ANS ce topic !!!!!!!!!!!!!!!!!!!!!!!!!
Toujours plus haut, toujours plus loin toujours plus .......­... heuu... Patientez S.V.P M.Web-actu a oublié ce qu'il vou­lez dire

   
Répondre à web-actu

33

Groscon, le 12 déc 2008 à 18:18:18

Toujours plus haut, toujours plus loin toujours plus .......­... heuu...
Patientez S.V.P M.Web-actu a oublié ce qu'il vou­lez dire

É y voulé dir koi ? Il voulait sans doute dire que les signes de ponctuation simple ne sont précédés d'aucune espace et sont suivis d'une espace sécable tandis que les doubles sont précédés d'une espace insécable et suivis d'une espace sécable.

Merci pour ces exemples qui m'auront bien servis.

   
Répondre à Groscon

35

BartWadela, le 20 jan 2009 à 01:56:23

4 maintenant !!

   
Répondre à BartWadela

34

web-actu, le 13 déc 2008 à 11:39:02

Humhum... Toujours plus haut! Toujours plus loin! toujours plus ......­.... heuu... Patientez S.V.P M.Web-actu a oublié ce qu'il vo­ulez dire

   
Répondre à web-actu

37

web-actu, le 21 jan 2009 à 16:33:48

Merci a tous :-o) lol !! Toujours plus haut, toujours plus loin toujours plus .......­... heuu... Patientez S.V.P M.Web-actu a oublié ce qu'il vou­lez dire

   
Répondre à web-actu

39

darkscythe, le 17 fév 2009 à 08:37:28

Personne n'a d'idée pour colorer la flèche d'un menu déroulant de ce type ? Car j'ai réussis pour une zone de texte mais la il ne prend pas les propriété de la scrollbar =(

<select name="liste">
<option value="Choix 1">Choix 1
<option value="Choix 2">Choix 2
<option value="Choix 3">Choix 3
</select>

   
Répondre à darkscythe

40

Dalida, le 17 fév 2009 à 13:32:55

Salut,

ouvre un fil pour ta question, tu es HS !
-;o)
[ Mathieu ] 

Il y a sûrement des pandas pour ne dépendre de rien

   
Répondre à Dalida

41

darkscythe, le 17 fév 2009 à 14:40:42

Salut,

J'ai posté ailleurs mais sans succès alors j'ai tenté ma chance ici désolée du HS ;o)

et merci

http://www.commentcamarche.net/forum/affich 11060252 menu deroulant html avec couleur?#1

   
Répondre à darkscythe

45

ben85350, le 13 mai 2009 à 21:23:45

Avec le CSS en plus du HTML c'est possible : http://www.siteduzero.com/...

   
Répondre à ben85350
50 réponses 12 Suivant
Posez votre question Répondre
Ils ont besoin de votre aide