Dev. FrontEnd#5 : Menu hamburger animé
Problème de lecture
Cette vidéo ne semble pas disponible
00:00
00:00

TUTO Dev. FrontEnd#5 : Menu hamburger animé

Carl Brison
11,00€

Téléchargement & visionnage illimité

Satisfait ou remboursé

Paiement 100% sécurisé

Apprenez à créer un menu hamburger animé !

Dans ce tuto vidéo je vous propose de découvrir comment animer un menu hamburger grâce au langage CSS ainsi qu'à la librairie jQuery.

  • Le premier chapitre de cette formation, sera consacré à la réalisation de cette animation afin de bien nous focaliser sur le code, sans aucun superflu.
  • Puis, dans le second chapitre, nous reprendrons les codes de mon précédent tutoriel "réaliser un menu responsive facilement" afin d'y incorporer notre menu hamburger animé.

A la fin de ce cours vous aurez donc appris à créer une animation de menu hamburger et à l'intégrer sur votre site Internet !

Je mets à votre disposition l'ensemble des codes de ce tuto en fichiers sources. Je reste bien évidemment disponible pour répondre à vos éventuelles questions dans le salon d'entraide. Un QCM est à votre disposition pour tester vos connaissances en animation de menus.

Bon tuto !

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Chapitre 1
Création d'un menu hamburger animé
Chapitre 2
Intégration du menu animé sur notre site
Chapitre 3
Conclusion

Plan détaillé du cours

Chapitre 1 : Création d'un menu hamburger animé
35m47s
 
Leçon 1Mise en place des bases
Leçon 2On dessine un menu hamburger avec le CSS
Leçon 3On anime le menu hamburger avec jQuery et CSS
Leçon 4Adaptation du menu hamburger pour le site
Chapitre 2 : Intégration du menu animé sur notre site
11m53s
 
Leçon 1Présentation du site avec sa nav
Leçon 2Intégration 1/2
Leçon 3Intégration 2/2
Chapitre 3 : Conclusion
57s
 
Leçon 1Conclusion

Avis des apprenants

Détail des avis
29
Apprenants
4
Commentaires
4,8/5
Note moyenne
5/5
3
4/5
1
3/5
0
2/5
0
1/5
0
Alain Tardif
Alain Tardif
Publié le 19/03/2023
Merci Carl pour ce cours hyper agréable. J'avoue prendre un très grand plaisir avec le front, en particulier ce genre de tuto. Je vous remercie beaucoup pour ce cours très bien expliqué. Validé 100 % menu hamburger animé.
Carl Brison
Carl Brison
Avec plaisir Alain ! Merci beaucoup pour votre commentaire toujours aussi gentil ;-)
Fabrice Chapier
Fabrice Chapier
Publié le 14/08/2020
Complément indispensable de votre tutoriel front end #4 ! Merci pour cet ajout ! Questions : 1) Si on clique sur un lien du menu, est-ce que le menu est toujours visible ? Si oui, comment le gérer ? En CSS ou en Jquery ? 2) comment intégrer plus facilement dans un autre site ? Avec Php ? Merci pour ce complément d’informations.
Carl Brison
Carl Brison
Si vous cliquez sur un lien, vous allez sur une nouvelle page. Donc à vous de récupérer le menu
Johanna Bader
Johanna Bader
Publié le 23/08/2019
Génial encore merci Carl de ton professionnalisme
Carl Brison
Carl Brison
Merci à toi Jonathan ;-)

Vos questions sur le cours

Avec quelles versions de logiciels ce tuto est-il compatible ?

CSS 3, jQuery

Que contient le fichier source ?

Tout le script du tuto

Quel est le niveau requis pour suivre ce tuto ?

débutant

Bonjour Carl Est-il possible de faire toutes ces animations en ne faisant QUE du CSS ? Parce que je suis intéressé par cette formation mais je déteste la programmation JavaScript. Merci d'avance.

Hello, Oui on peut le faire mais de façon plus light et c'est une excellente idée. Je vais faire un tuto sur ce sujet ! Merci ;-)

Attendez ! 🤗

Accédez à plus de 1334 tutos gratuits

Notre politique de protection des données