Le menu Burger
On appelle menu Burger un menu qui ne peut être
affiché en raison d’une taille d’écran
trop réduite. Pour ouvrir ce menu, l’utilisateur
pourra cliquer sur le symbole 
.
.Dans l’idée, le menu sera
affiché entièrement si l’écran
est suffisamment large et sera représenté par
ce symbole représentant plus ou moins un hamburger (), d’où son nom de menu Burger.
Vous pourrez consulter le dossier 4_18_burger
pour le voir fonctionner.
), d’où son nom de menu Burger.
Vous pourrez consulter le dossier 4_18_burger
pour le voir fonctionner.Nous aurons donc cet affichage sur un écran suffisamment large :
Et ceux-ci pour un écran plus petit :
Fermé
Ouvert
Voyons le code qui permet d’avoir automatiquement ce type de menu.
Côté HTML
<body>
<input type="checkbox" id="menuBurger">
<label for="menuBurger">☰</label>
<nav role="navigation" id="navMenu">
<ul>
<li><a href="#">Rubrique1</a></li>
<li><a href="#">Rubrique2</a></li>
<li><a href="#">Rubrique3</a></li> ...
Conditions générales d'utilisationCopyright - © Editions ENI ||Politique de protection des données du groupe ENI