12,00

Tuto Comment créer un menu burger vertical dynamique avec JavaScript, CSS

12,00

  • Une formation vidéo de 53m32s
  • Téléchargement immédiat et visionnage illimité à vie
  • Satisfait ou remboursé
  • Fichiers sources inclus
  • Découvrez pourquoi vous former avec Tuto.com
Comment créer un menu burger vertical dynamique

ajouter ce cours aux favoris retirer ce cours des favoris

Dans ce cours en ligne destiné à améliorer le côté front des pages web, nous allons mettre en place un menu burger.
Ce menu activera l'apparition verticale d'une zone de navigation lorsque l'utilisateur cliquera dessus. Cette navigation recouvrera intégralement notre page. Ce menu burger restera à l'écran tant que l'utilisateur n'aura pas décidé de le refermer.
Nous devrons donc gérer les différents états d'affichage du menu, mais également de l'icône burger.

Ce qui est intéressant et important ici, c'est d'acquérir la bonne logique de construction de ce classique du front end.
Pour suivre ce tutoriel vidéo dans de bonnes conditions, il est recommandé de connaître :

Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions sur ce cours.
Un QCM vous sera proposé en fin de formation et vous permettra de valider les connaissances théoriques acquises pendant la formation.

Table des matières de cette formation JavaScript, CSS (durée : 53m32s)

    • Mise en place des zones principales 00:08:01
    • Mise en fonctionnement de la zone Nav 00:08:31
    • Mise en place du menu burger 00:08:18
    • Mise en fonctionnement du menu burger 00:07:48
    • Une autre façon d'aborder notre programme 00:05:30
    • Mise en place des liens de navigation 00:11:26
    • Côté responsive 00:02:05
    • Conclusion 00:01:53



Formateur : Carl Brison

Carl Brison a publié 262 tutoriels et obtenu une note moyenne de 4,9/5 sur 16 830 tutoriels vendus. Carl Brison est un formateur certifié tuto.com. Voir les autres formations de Carl Brison

3,3
note moyenne

3
avis laissés
5 étoiles
0
4 étoiles
1
3 étoiles
2
2 étoiles
0
1 étoile
0
  • 4
    avis de membre-1153-7167 laissé le 18/04/2022
    Cela permet de revoir css flexbox

  • 3
    avis de toutkool laissé le 19/04/2022
    Tuto sympa pour donner un préambule mais quelques défaut (à mon avis bien sur), déjà, le fait de donner la classe active au body n'est pas à mon gout, trop d'éléments peuvent du coup en dépendre, pour ma part je préfère cibler un élément bien précis, aussi et là c'est plus de la cosmétique, votre solution pour du "responsive" est très très minimaliste, un affichage en column avec un flex-direction sur le UL, au travers d'une media query aurait été peut être plus approprié plutôt que garder ça en ligne, surtout pour un affichage sur une résolution qui s'apparente à celle d'un mobile, enfin question de goût. Merci en tout cas.

  • 3
    avis de vpetitgi laissé le 16/04/2022
    La double approche (direct ou parent) est instructive. La progression pédagogique est agréable et claire. Cependant, toutes les fioritures sont assez lourdingues pour la maintenance et procure une expérience utilisateur contestables. De plus, un menu occultant comme proposé est assez déconcertant et peu vraisemblable en production.
    "Lourd dingue !!!??????????? Rien ne vous empêche de rester poli !!!!!!!!!!! Vous vous prenez pour qui ???????!!!!!!!"

  • Avec quelle version de logiciel ce tuto est-il compatible ?
    CSS
  • Quel est le niveau requis pour suivre ce tuto ?
    débutant
Parcours Developpeur Front End
accédez à plus de 1437 tuto gratuits


non, je ne veux pas me former gratuitement

voir notre politique de protection des données