Vous n'êtes pas fan de la programmation et pourtant vous aimeriez avoir un menu burger sur votre site, lorsque celui-ci a une taille réduite ?
Alors ce tuto en vidéo est fait pour vous.
Je vous propose de faire ensemble une page web, moderne, efficace et 100% responsive, sans jamais faire appel, ni au JavaScript, ni au jQuery et encore moins à la librairie VueJS.
Uniquement de HTML et du CSS et rien d'autre !
Notre projet, réalisé en desktop first, possédera par défaut une barre de navigation horizontale.
En deçà d'un certain point, la mise en forme de la navigation sera modifiée. A la place des liens composant le menu, nous mettrons en place une icône représentant un menu burger. Et lorsque l'utilisateur va cliquer sur cette icône, alors un menu vertical venant de la droite de l'écran viendra couvrir l'ensemble de la page web. Une petite croix permettra à l'utilisateur de fermer le menu.
Pour suivre ce tuto dans de bonnes conditions, il est préférable de connaître Flexbox. Voici un tuto qui vous permettra de maîtriser cette technologie en cas de besoin
Je mets l'ensemble du code source à votre disposition et je reste disponible dans le salon d'entraide pour répondre à vos questions sur le cours.
Bonne formation.
Avis des apprenants