Skip to main content

Navbar Sticky

Demo

Faites défilez cette page pour voir la navbar devenir sticky. Un data-attribute est ajouté sur le body, vous permettant de styliser la navbar ou autres éléments selon le scroll. Vous pouvez ainsi créer une navbar qui shrink, etc.

Documentation

Importez la fonction dans votre projet

Adaptez le path selon la structure de votre projet

import { NavbarSticky } from "./functions/navbar-sticky"

Créez et initialisez une instance - exemple

// create an instance with your options
new NavbarSticky(".navbar-sticky", {
   // add your options here
}).init()
  • Name
    Type
    Default
    Description
  • scrollTopDistance
    integer
    80
    La distance du top à partir de laquelle la navbar sera sticky.
  • dataStateValue
    string
    active
    La valeur qui sera ajoutée au data-attribute sur le body

Code

Dossier de base

Dossier complet