1448 sujets

Web Mobile et responsive web design

Bonjour,

A l’aide de JQuery j’ai mis en place un menu (ul#menu) responsive.
Quand la largeur de l’écran d’affichage passe sous 480px un bouton (button#b1) « Menu » s’affiche, le cliquage sur ce bouton affiche ou fait disparaître le menu (ul#menu).
Toutefois par défaut le menu s’affiche et je souhaiterai qu’il ne s’affiche pas.
Je n’arrive pas à développer le JS nécessaire ou à modifier le JS utilisé.

Merci pour votre aide.
Cordialement
Patrick MARA


@media screen and (min-width: 480px) {   
   button#b1 {
      display: none;
	}
}


<!--On inclut la librairie jQuery-->
<script src='jquery-3.2.1.js'></script>
<!--On écrit notre code JavaScript / jQuery-->
<script>
            $(document).ready(function(){
                $('#b1').click(function(){
                    $('ul#menu').toggle();
                });
            });
 </script>
Modérateur
pmara a écrit :

...
Toutefois par défaut le menu s’affiche et je souhaiterai qu’il ne s’affiche pas.
...

@media screen and (min-width: 480px) {   
   button#b1 {
      display: none;
	}
}


            $(document).ready(function(){
                $('#b1').click(function(){
                    $('ul#menu').toggle();
                });
            });


Sans code html associé....

Relis ce que je viens de te citer, et essaie de comprendre d'où ton erreur semble provenir. Mais comme j'ai écris ci-dessus :

a écrit :
Sans code html associé....
Bonjour,

Merci pour votre réponse mais sa relecture ne m'apporte pas la compréhension attendue.
Ceci dit je ne suis pas un grand spécialiste du javascript, pour lequel je pioche sur la toile la plupart du temps

Cordialement
Patrick MARA
pmara a écrit :

Toutefois par défaut le menu s’affiche et je souhaiterai qu’il ne s’affiche pas.


Par défaut par rapport à quoi ? au passage du 480px ? à l'affichage du site > 480px ? < ?
Bonjour,

Merci d'accorder de l'attention à ce sujet.
Quand la fenêtre disponible est à moins de 480px le bouton button#b1 s'affiche et je voudrais que le menu ul#menu ne s'affiche que sur un premier clic du bouton.

Cordialement
Patrick MARA.
Donc si je comprend bien :
@media screen and (max-width: 480px) {   
   ul#menu {
      display: none;
	}
}

Modifié par JENCAL (22 Jan 2018 - 16:19)
Bonjour,

Et oui, c'est d'une évidence. Il y a des jours sans !

Merci
Cordialement
Patrick MARA