hut-menu

intro

A simple HTML menu module that creates interactive dropdown menus. It contains a minimum amount of styling so that you can customize it to your needs. See the example to see it in action.

usage

1. Install using npm - npm install --save hut-menu
2. Import styling using rework-npm - @import "hut-menu";
3. Load JS using browserify - var menu = require('hut-menu');

code

<ul class="hut-tabs" id="menu">
    <li><a href="#home">Home</a></li>
    <li>
        <a href="#">Docs</a>
        <ul id="docs-menu">
            <li><a href="#intro">Introduction</a></li>
            <li><a href="#reference">Reference</a></li>
        </ul>
    </li>
</ul>

var menu = require('hut-menu');

var el = document.querySelector('#menu'),
    m = menu(el);

// Open a submenu
m.open(document.querySelector('#docs-menu'));

// Close the currently open submenu
m.close();

reference

menu(element)

Creates a new menu component and attaches the event handlers. It will return a new Menu object.

#current

The currently open submenu (the nested ul element), or null if no submenu is open.

#open(submenu)

Opens a submenu. submenu must be the nested ul element to open. It will also close any currently open submenu.

#close()

Closes any currenly open submenu.