Dans ce cours en vidéo nous allons apprendre à créer toute sorte de menus et de navigations en HTML / CSS / JavaScript.
Le navigation est une des parties les plus importantes de vos sites / app ; voire LA plus importante !
Il est donc important de savoir maîtriser les différents types de menus qu'il existe.
Dans ce cours nous apprendrons à construire 8 menus :
- Une navbar classique responsive,
- Un menu pop-up circulaire,
- Un accordéon vertical,
- Une navigation mobile,
- Un menu stylisé rond dans un coin,
- Un menu "languette",
- Un dropdown en pure CSS,
- Un menu vertical qui se déclenche au survol.
Tout est expliqué de A à Z.
Les codes sources sont fournis et je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions sur la réalisation de ces menus.
Rendez-vous de l'autre côté pour coder tout ça !
Table des matières de cette formation CSS, JavaScript (durée : 2h19m)
-
Introduction
- Introduction gratuit 00:00:48
- Code source 00:02:09
-
La navbar classique
- Partie HTML 00:10:56
- CSS et animation de bouton 00:06:13
- Partie JS et finition 00:04:39
-
Menu pop-up circulaire
- Partie HTML 00:02:44
- Animation des "blobs" 00:14:42
- Animation du bouton 00:04:18
-
Menu Accordéon vertical
- Partie HTML accordéon 00:05:18
- Partie CSS Accordéon 00:09:29
- Partie JS accordéon 00:07:38
-
Navigation mobile
- Menu navigation mobile 00:12:51
-
Menu Rond
- Création menu rond 00:09:58
- Partie JavaScript 00:08:18
-
Menu Rideau
- Création du menu rideau 00:08:08
-
Menu dropdown pur CSS
- Dropdown pur CSS 00:11:11
-
Navigation verticale, animation au survol
- Partie HTML / CSS 00:12:49
- Partie JS et fin 00:07:03
- Fichiers sourcestélécharger
- Certificat
Formateur : Enzo Ustariz
-
Super tuto pour apprendre à construire ses navbars. Enzo toujours dans le concret.
-
Contente d'avoir suivi le cours de chacun de ces différents menus. J'ai compris qu'il vaut mieux utiliser des class pour les niveaux de liste. J'ai tendance à beaucoup me prendre la tête avec les ul et les li dans le css. Et j'ai pu avoir un petit aperçu du javascript. J'ai apprécié vos explications pour chaque chose, c'est parfait pour combler certaines lacunes et prendre des notes. Merci pour nous avoir partagé toutes ces connaissances.
-
Rapide clair concis . Pour le moment j'ai regarder que la navbar classique mais j'ai pas resister a mettre 6 étoiles, ca demande certains pre-requis mais cette formation pourrait certainement en booster beaucoup dans leurs apprentissage ????bref aldente
-
Avec quelles versions de logiciels ce tuto est-il compatible ?CSS , JavaScript
-
Quel est le niveau requis pour suivre ce tuto ?débutant
note moyenne
avis laissés