Barre nav en position dynamique puis statique
Bonjour,
Je viens de créer une page sur laquelle apparait mon header (une photo avec le titre du site situé en bas de la photo) et sous le header il y a une zone nav qui contient 4zones cliquables. Bref rien d'extraordinaire, par contre j'aimerais qu'en scrollant, le header disparaisse (normal) mais que la barre nav reste bloqué en haut de l'écran, afin que le menu de navigation soit toujours visible.
Je ne comprend pas très bien si je peux le faire avec le code CSS et si oui, comment le programmer...
D'avance merci :-)
Victor
Je viens de créer une page sur laquelle apparait mon header (une photo avec le titre du site situé en bas de la photo) et sous le header il y a une zone nav qui contient 4zones cliquables. Bref rien d'extraordinaire, par contre j'aimerais qu'en scrollant, le header disparaisse (normal) mais que la barre nav reste bloqué en haut de l'écran, afin que le menu de navigation soit toujours visible.
Je ne comprend pas très bien si je peux le faire avec le code CSS et si oui, comment le programmer...
D'avance merci :-)
Victor
1 réponse
-
Salut,
Ce genre de menu se nomme couramment "sticky menu". Une petite recherche via ton moteur préféré devrait te permettre de trouver plusieurs tutos à ce sujet.
Bonne journée,-
-
Il va effectivement devoir utiliser javascript pour détecter la position du scroll de la page.
Il existe des plugins javascript permettant de réaliser cette fonctionnalité en écrivant peu de code javascript : une connaissance basique du langage devrait donc suffire.
Un exemple parmi d'autre : http://stickyjs.com/
-
