La Composant Header est un composant JavaScript utilisé pour créer ou personnaliser l'en-tête d'un site web. JavaScript permet de créer des en-têtes personnalisés qui sont réactifs, animés ou ont d'autres fonctionnalités interactives.
Après importation du javascript, dans le html aller mettre le data-component. Créé le toggle pour le responsive.
Pour voir comment ajouter la composante au JS
Ajouter data-limit = “limit” sur un élément pour que le header se cache une fois atteint.
Ajouter data-not-hiding="not-hiding" pour empêcher que le header se cache.
exemple avec data-limit=”limit”
Dans le fichier css du header, section nav-primary>ul vous pouvez modifier l’animation lorsque la navigation responsive est active.
-header-is-hidden(va cacher le header)
-is-scrolling-down(indique au css de reagire en fonction que le scroll va vers le bas)
-is-scrolling-up (indique au css de reagire en fonction que le scroll va vers le bas)
-js-toggle(fais activer activer la nav en responsive)