Skip to main content

Menu 2-panel

Demo

Utilisez le bouton 1 dans la barre de navigation du haut de cette page pour tester cet élément.

Documentation

Importez la fonction dans votre projet

import { MenuTwoPanel } from "./functions/menu-two-panel.js"

Créez une instance de base et initialisation

Si les valeurs de base des options vous conviennent, vous pouvez simplement créer votre instance sans option.

const myMenuTwoPanel = new MenuTwoPanel("#menu-two-panel", {
  // your options here - see options below
})

myMenuTwoPanel.init()

Options

  • Name
    Type
    Default
    Description
  • menuLabel
    CSS selector
    ".menu__label"
  • menuLabelActiveClass
    CSS class
    "menu__label--active"
  • submenu
    CSS selector
    ".submenu"
  • submenuOpenClass
    CSS class
    "submenu--open"
  • collapseBreakpoint
    string
    "767px"

Code

Dossier de base

Dossier de base

Éléments partagés requis

Fonctions Collapse pour small devices

Combinez avec ceci

Mega-nav de base (utilisée dans ce demo)

Feuilles de style optionnelles

Navbar