bonjour,
j'essaie de faire un menu déroulant mais rien ne fonctionne j'utilise jquery.
mon code
le css
Code CSS : 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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64 ul.menu{ list-style-type:none; position:fixed; left:0; top:0; margin:0; width:100%; height:80px; background:#FFFFFF; border-bottom:1px solid #000000; } @media screen and (min-width: 1201px) { div.menu{display:none;} ul.menu li{ font-size:100%; width:12%; margin-left:1.9%; line-height: 80px; height:80px; display:inline; background:#FFFFFF; } ul.menu li a{ color:#000000; } } @media screen and (max-width:1200px){ div.menu{ position:fixed; right:0; top:0; margin:0; } ul.menu li{display:list-item; width:100%; } ul.menu li.menu{ display:none; line-height:40px; height:40px; background:#000000; margin-left:0; color:#FFFFFF; } ul.menu li.menu a{color:#FFFFFF;} ul.menu li.acceuil{width:100%;} } ul.menu li.acceuil{ margin-left:-1%; font-size:150%; font-weight:bold; line-height: 80px; height:80px; } ul.menu li.acceuil a{ color:#000000; } ul.menu li a{ text-decoration:none; } ul.menu li a:hover{ text-decoration:underline; } ul.sous-menu{display:none;}
le html et le jqueryt
merci pour votre aide
Code HTML : 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 <ul class=menu> <li class=acceuil><a href=./>Laetitia Poulain</a></li> <li class="menu"><a href="">Mes soins</a> <ul class=sous-menu> <li>Massage femme enceinte</li> <li>Massage post natal</li> <li>Séance rebozo bassin</li> <li>Massage bébé</li> </ul></li> <script> $("ul.menu li.menu").click(function(){ $("ul.sous-menu li").slideToggle("slow",function(){ }); }); </script> <li class=menu><a href=Elles-temoignent.php>Elles témoignent</a></li> <li class=menu><a href="qui-suis-je.php">Qui je suis ?</a></li> <li class=menu><a href="">Prestations à domicile / Horaires</a></li> <li class=menu><a href=contact.php>Me contacter</a></li> <li class=menu><a href="offre.php">Mes offres</a></li> </ul> <div class=menu><img src=photo/image-menu.jpg alt=""></div> <script> $("div.menu").click(function(){ $("ul.menu li.menu").slideToggle("slow",function(){ }); }); </script>
Partager