Web Component: j-Navigation


  • Info
  • HTML
  • JS
  • CSS
  • Meta

j-Navigation

  • a simple navigation component like Tree
  • easy for customization
  • supports dark mode

Configuration:

  • exec {String} a link to the function
  • pk {String} a primary key (default: id) for remembering last state of tree

Data-source:

[
    {
        id: 1,
        name: 'Text to navigation item',
        title: 'Optional, a title attribute',
        collapsed: true, // only for children, default "false"
        children: [
            // Can contain same structure as the parent
        ]
    }
]

Good to know:

  • only items without children are clickable
  • exec returns an entire object

Author