Iconbar add-on - mmenu.js documentation

To prepend an iconbar to the menu, use the iconbar options and configuration.

<script>
    document.addEventListener(
        "DOMContentLoaded", () => {
            new Mmenu( "#menu", {
                iconbar: {
                    // iconbar options
                }
            }, {
                iconbar: {
                    // iconbar configuration
                }
            });
        }
    );
</script>

Example

Give it a go, change the options below and see how it affects the menu.

Prepend an iconbar to the menu.

<script>
    document.addEventListener(
        "DOMContentLoaded", () => {

        }
    );
</script>

Options for the "iconbar" add-on

Option	Datatype	Default value	Description
iconbar
{
use	`boolean String Number`	`false`	Whether or not to prepend an iconbar to the menu. Can be a boolean, a string (media query) or a number (for the window min-width).
position	`String`	`"left"`	Where to position the iconbar in the menu. Possible values: `"left"` and `"right"`.
bottom	`String[] HTMLElement[]`	`[]`	An array of strings (for text or HTML) or HTML elements for icons to put in the bottom of the iconbar.
top	`String[] HTMLElement[]`	`[]`	An array of strings (for text or HTML) or HTML elements for icons to put in the top of the iconbar.
type	`String`	`null`	The type of iconbar. Set to `"tabs"` to make all anchors in the iconbar behave like tabs.
}

Configuration for the "iconbar" add-on

The "iconbar" add-on has no configuration options.

CSS variables for the "iconbar" add-on

Variable	Datatype	Default value	Description
--mm-iconbar-size	`pixels`	`50px`	The width of the iconbar, in pixels.

API methods for the "iconbar" add-on

The "iconbar" add-on has no API methods.