ES6 MoreMenu

A EcmaScript6 MoreMenu module Download on GitHub

The easy fix for long horizontal menu's

With this plugin you can add more menu functionality to your website.

How it works

When the menu is initialized on a menu, it will check how many items fit on it's row. The not fitting items will be placed inside a 'more..' menu item. This way you wont have trouble making menu items fit on a small device.

Getting started

Use the plugin as follows:

import {moreMenu} from "./es6-moremenu.js";

var mm_menu = new moreMenu('#menu');

Options

more_link_contents
label of the 'more' menu item.
extra_offset
more whitespace on the right edge of the menubar

Default configuration

var settings = {
	more_link_contents: '<a href="#">More..</a>',
	extra_offset: 1
};

Methods

refresh_menu_items
With this method you can refresh the menu items array. When you have for instance created a new menu item with js after initialisation.
move_unfitting_items
Checks how many items fit, and moves the unfitting ones. When you change the width of the menu, you should call this method to update the menu.

Events

These are triggerd on the element on which the plugin is initialized.

mm_initialized
This event is triggerd when the more menu has been constructed.
mm_moved_items
This event is called each time the class has been updated.

Frequently asked questions

None yet actualy, but i would love to hear your questions or feedback.

Leave your questions and/or feedback here.