PHPackages                             onokumus/metismenu - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. onokumus/metismenu

ActiveLibrary[Utility & Helpers](/categories/utility)

onokumus/metismenu
==================

A jQuery menu plugin

v3.0.7(5y ago)2.0k263.3k↑10.1%476[80 issues](https://github.com/onokumus/metismenu/issues)[1 PRs](https://github.com/onokumus/metismenu/pulls)5MITJavaScriptCI failing

Since Apr 3Pushed 3mo ago102 watchersCompare

[ Source](https://github.com/onokumus/metismenu)[ Packagist](https://packagist.org/packages/onokumus/metismenu)[ Docs](https://github.com/onokumus/metisMenu)[ RSS](/packages/onokumus-metismenu/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (8)DependenciesVersions (41)Used By (5)

metismenu [![NPM version](https://camo.githubusercontent.com/314738e3856e547a90d4dfeefce2b520a8190aa38e481f6922f9f312651a9216/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f762f6d657469736d656e752e7376673f7374796c653d666c6174)](https://www.npmjs.com/package/metismenu) [![NPM monthly downloads](https://camo.githubusercontent.com/6baebb97f8d2b8f861c1a830c9416a347cc6d83a399f5535fa0f3ea2cf59a5f5/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f646d2f6d657469736d656e752e7376673f7374796c653d666c6174)](https://npmjs.org/package/metismenu) [![NPM total downloads](https://camo.githubusercontent.com/b8e8d4dbd97ff94ce266f39b9439645e9adee8e79cbafb9da81394d8d77748d9/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f64742f6d657469736d656e752e7376673f7374796c653d666c6174)](https://npmjs.org/package/metismenu)
=====================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================

[](#metismenu---)

> A collapsible jQuery menu plugin
>
> This version does not support any version of IE browser.

- [Getting started](#getting-started)
    - [Install](#install)
    - [Download](#download)
- [Usage](#usage)
    - [Stopping list opening on certain elements](#stopping-list-opening-on-certain-elements)
        - [toggle](#toggle)
        - [dispose](#dispose)
        - [preventDefault](#preventdefault)
        - [triggerElement](#triggerelement)
        - [parentTrigger](#parenttrigger)
        - [subMenu](#submenu)
- [Events](#events)
- [Migrating to v3 from v2](#migrating-to-v3-from-v2)
- [Demo](#demo)
- [About](#about)
    - [Related projects](#related-projects)
    - [Contributors](#contributors)
    - [Contributing](#contributing)
    - [Release History](#release-history)
    - [Author](#author)
    - [License](#license)

Getting started
---------------

[](#getting-started)

### Install

[](#install)

Install with [npm](https://www.npmjs.com/):

```
npm install metismenu
```

Install with [yarn](https://yarnpkg.com):

```
yarn add metismenu
```

Install with [bun](https://bun.sh/):

```
bun add metismenu
```

Install with [composer](https://getcomposer.org/)

```
composer require onokumus/metismenu:dev-master
```

### Download

[](#download)

[download](https://github.com/onokumus/metisMenu/archive/master.zip)

Usage
-----

[](#usage)

1. Include metismenu StyleSheet

```

```

1. Include jQuery

```

```

1. Include metisMenu plugin's code

```

```

1. Using with ESM/Bundler (Vite, Webpack, Rollup)

```
import $ from 'jquery';
import MetisMenu from 'metismenu';
// OR
import { MetisMenu } from 'metismenu';

const mm = new MetisMenu("#metismenu");
// OR
$("#metismenu").metisMenu();
```

1. Add id attribute to unordered list

```

```

1. Make expand/collapse controls accessible

> Be sure to add `aria-expanded` to the element `a`. This attribute explicitly defines the current state of the collapsible element to screen readers and similar assistive technologies. If the collapsible element is closed by default, it should have a value of `aria-expanded="false"`. If you've set the collapsible element's parent `li` element to be open by default using the `mm-active` class, set `aria-expanded="true"` on the control instead. The plugin will automatically toggle this attribute based on whether or not the collapsible element has been opened or closed.

```

    Menu 1

    ...

    Menu 2

    ...

  ...

```

1. Arrow Options

> add `has-arrow` class to `a` element

```

  Menu 1

  ...

  Menu 2

  ...

...

```

1. Call the plugin:

```
  $("#metismenu").metisMenu();
```

### Stopping list opening on certain elements

[](#stopping-list-opening-on-certain-elements)

Setting aria-disabled="true" in the `` element as shown will stop metisMenu opening the menu for that particular list. This can be changed dynamically and will be obeyed correctly:

```
List 1
```

#### toggle

[](#toggle)

Type: `Boolean`Default: `true`

For auto collapse support.

```
 $("#metismenu").metisMenu({
   toggle: false
 });
```

#### dispose

[](#dispose)

Type: `String`Default: `null`

For stop and destroy metisMenu.

```
 $("#metismenu").metisMenu('dispose');
```

#### preventDefault

[](#preventdefault)

Type: `Boolean`Default: `true`

> Prevents or allows dropdowns' onclick events after expanding/collapsing.

```
 $("#menu").metisMenu({
   preventDefault: false
 });
```

*since from version 2.7.0*

#### triggerElement

[](#triggerelement)

Type: `jQuery selector`Default: `a`

```
 $("#metismenu").metisMenu({
   triggerElement: '.nav-link' // bootstrap 5
 });
```

#### parentTrigger

[](#parenttrigger)

Type: `jQuery selector`Default: `li`

```
 $("#metismenu").metisMenu({
   parentTrigger: '.nav-item' // bootstrap 5
 });
```

#### subMenu

[](#submenu)

Type: `jQuery selector`Default: `ul`

```
 $("#metismenu").metisMenu({
   subMenu: '.nav.flex-column' // bootstrap 5
 });
```

Events
------

[](#events)

**Event Type****Description**show.metisMenuThis event fires immediately when the `_show` instance method is called.shown.metisMenuThis event is fired when a collapse `ul` element has been made visible to the user (will wait for CSS transitions to complete).hide.metisMenuThis event is fired immediately when the `_hide` method has been called.hidden.metisMenuThis event is fired when a collapse `ul` element has been hidden from the user (will wait for CSS transitions to complete).Migrating to v3 from v2
-----------------------

[](#migrating-to-v3-from-v2)

- Update `metisMenu.js` & `metisMenu.css` files
- Change `active` class to `mm-active`

Demo
----

[](#demo)

Contains a simple HTML file to demonstrate metisMenu plugin.

About
-----

[](#about)

### Related projects

[](#related-projects)

- [@metismenu/react](https://www.npmjs.com/package/@metismenu/react): react component for MetisMenu | [homepage](https://github.com/onokumus/metismenu-react#readme "react component for MetisMenu")
- [metismenujs](https://www.npmjs.com/package/metismenujs): MetisMenu with Vanilla-JS | [homepage](https://github.com/onokumus/metismenujs#readme "MetisMenu with Vanilla-JS")

### Contributors

[](#contributors)

**Contributor**[onokumus](https://github.com/onokumus)[diegozhu](https://github.com/diegozhu)[sinabs](https://github.com/sinabs)[DrugoLebowski](https://github.com/DrugoLebowski)[BurkovBA](https://github.com/BurkovBA)[arthurtalkgoal](https://github.com/arthurtalkgoal)[mrdziuban](https://github.com/mrdziuban)[nicolasigot](https://github.com/nicolasigot)[PeterDaveHello](https://github.com/PeterDaveHello)[kalidema](https://github.com/kalidema)[AndrewEastwood](https://github.com/AndrewEastwood)[rgnevashev](https://github.com/rgnevashev)[719media](https://github.com/719media)[chriswiggins](https://github.com/chriswiggins)[jmagnusson](https://github.com/jmagnusson)[LukasDrgon](https://github.com/LukasDrgon)[Cediddi](https://github.com/Cediddi)[WoMayr](https://github.com/WoMayr)[capynet](https://github.com/capynet)### Contributing

[](#contributing)

Pull requests and stars are always welcome. For bugs and feature requests, [please create an issue](../../issues/new).

Please read the [contributing guide](.github/contributing.md) for advice on opening issues, pull requests, and coding standards.

### Release History

[](#release-history)

**DATE****VERSION****CHANGES**2026-01-22v3.1.0Support jQuery 4 [\#207](https://github.com/onokumus/metismenu/issues/207)2021-05-16v3.0.7sass support2020-03-22v3.0.6fix security vulnerabilities2019-12-28v3.0.5Fix dispose to be similar to init (adding event) [\#184](https://github.com/onokumus/metismenu/pull/184)2019-03-07v3.0.4fix2018-10-05v3.0.3fix2018-10-05v3.0.2fix2018-10-05v3.0.1fix2018-10-05v3.0.0more functionally2018-10-05v2.7.9.1Fix dispose option [\#173](https://github.com/onokumus/metismenu/pull/173)2018-06-28v2.7.9Make jquery a peer dependency2018-06-14v2.7.8remove aria-expanded attribute & remove transitionend check2018-02-14v2.7.4jQuery -> $ in src/metisMenu.js to fix import. [\#158](https://github.com/onokumus/metismenu/pull/158)2018-02-14v2.7.3window might not be defined in node.js environment [\#156](https://github.com/onokumus/metismenu/pull/156)2017-12-31v2.7.2isolate against bootstrap changes, remove old legacy ie9 code [\#154](https://github.com/onokumus/metismenu/pull/154)2017-10-30v2.7.1added check in complete()-callback to break when menu was disposed [\#150](https://github.com/onokumus/metismenu/pull/150)2017-03-08v2.7.0fixed `has-arrow` class border color & added new 3 options2017-02-23v2.6.3fixed #1292017-02-02v2.6.2doubleTapToGo option is deprecated2016-12-06v2.6.1fix require.js2016-11-29v2.6.0dispose support2016-05-06v2.5.2fix Menu failed to remove collapsing class2016-05-06v2.5.1fixed bootstrap conflict2016-03-31v2.5.0Event support2016-03-11v2.4.3create meteor package2016-03-04v2.4.2back to version 2.4.02016-03-03v2.4.1Transition element passed to methods (removed)2016-01-25v2.4.0Support AMD / Node / CommonJS2016-01-08v2.3.0Adding aria-disabled=true to the link element prevents the dropdown from opening2015-09-27v2.2.0Events supported & added preventDefault options2015-08-06v2.1.0RTL & `aria-expanded` attribute & TypeScript type definitions support2015-07-25v2.0.3When the active item has doubleTapToGo should not collapse2015-05-23v2.0.2[fixed](https://github.com/onokumus/metisMenu/issues/34#issuecomment-104656754)2015-05-22v2.0.1changeable classname support2015-04-03v2.0.0Remove Bootstrap dependency2015-03-24v1.1.3composer support2014-11-01v1.1.3Bootstrap 3.3.02014-07-07v1.1.0Add double tap functionality2014-06-24v1.0.3cdnjs support & rename plugin2014-06-18v1.0.3Create grunt task2014-06-10v1.0.2Fixed for IE8 & IE9### Author

[](#author)

**Osman Nuri Okumus**

- [GitHub Profile](https://github.com/onokumus)
- [Twitter Profile](https://twitter.com/onokumus)
- [LinkedIn Profile](https://linkedin.com/in/onokumus)

### License

[](#license)

Copyright © 2026, [Osman Nuri Okumus](https://github.com/onokumus). Released under the [MIT License](LICENSE).

###  Health Score

60

—

FairBetter than 99% of packages

Maintenance52

Moderate activity, may be stable

Popularity62

Solid adoption and visibility

Community42

Growing community involvement

Maturity75

Established project with proven stability

 Bus Factor1

Top contributor holds 84.8% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~58 days

Recently: every ~238 days

Total

39

Last Release

1829d ago

Major Versions

v2.7.8 → v3.0.0-alpha.02018-06-17

v2.7.9 → v3.0.0-beta.02018-07-12

### Community

Maintainers

![](https://www.gravatar.com/avatar/638c294d40392fed3cec1d1da34410b03460fc277ba164f5218f6c586d801365?d=identicon)[onokumus](/maintainers/onokumus)

---

Top Contributors

[![onokumus](https://avatars.githubusercontent.com/u/742498?v=4)](https://github.com/onokumus "onokumus (245 commits)")[![diegozhu](https://avatars.githubusercontent.com/u/1610612?v=4)](https://github.com/diegozhu "diegozhu (8 commits)")[![sinabs](https://avatars.githubusercontent.com/u/1351257?v=4)](https://github.com/sinabs "sinabs (4 commits)")[![DrugoLebowski](https://avatars.githubusercontent.com/u/6850946?v=4)](https://github.com/DrugoLebowski "DrugoLebowski (4 commits)")[![BurkovBA](https://avatars.githubusercontent.com/u/7602655?v=4)](https://github.com/BurkovBA "BurkovBA (3 commits)")[![rgnevashev](https://avatars.githubusercontent.com/u/123600?v=4)](https://github.com/rgnevashev "rgnevashev (2 commits)")[![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?v=4)](https://github.com/dependabot[bot] "dependabot[bot] (2 commits)")[![arthurtalkgoal](https://avatars.githubusercontent.com/u/7088330?v=4)](https://github.com/arthurtalkgoal "arthurtalkgoal (2 commits)")[![kalidema](https://avatars.githubusercontent.com/u/8334931?v=4)](https://github.com/kalidema "kalidema (2 commits)")[![AndrewEastwood](https://avatars.githubusercontent.com/u/1483306?v=4)](https://github.com/AndrewEastwood "AndrewEastwood (2 commits)")[![mrdziuban](https://avatars.githubusercontent.com/u/4718399?v=4)](https://github.com/mrdziuban "mrdziuban (2 commits)")[![nicolasigot](https://avatars.githubusercontent.com/u/599470?v=4)](https://github.com/nicolasigot "nicolasigot (2 commits)")[![PeterDaveHello](https://avatars.githubusercontent.com/u/3691490?v=4)](https://github.com/PeterDaveHello "PeterDaveHello (2 commits)")[![jacobsvante](https://avatars.githubusercontent.com/u/190835?v=4)](https://github.com/jacobsvante "jacobsvante (1 commits)")[![capynet](https://avatars.githubusercontent.com/u/1402913?v=4)](https://github.com/capynet "capynet (1 commits)")[![Cediddi](https://avatars.githubusercontent.com/u/2720608?v=4)](https://github.com/Cediddi "Cediddi (1 commits)")[![chriswiggins](https://avatars.githubusercontent.com/u/2830609?v=4)](https://github.com/chriswiggins "chriswiggins (1 commits)")[![CuWoMayr](https://avatars.githubusercontent.com/u/162571997?v=4)](https://github.com/CuWoMayr "CuWoMayr (1 commits)")[![719media](https://avatars.githubusercontent.com/u/5942229?v=4)](https://github.com/719media "719media (1 commits)")[![leomeurer](https://avatars.githubusercontent.com/u/5250903?v=4)](https://github.com/leomeurer "leomeurer (1 commits)")

---

Tags

jqueryjquery-pluginmenumetismenupluginwebcssJSjquerymenubootstrap

### Embed Badge

![Health badge](/badges/onokumus-metismenu/health.svg)

```
[![Health](https://phpackages.com/badges/onokumus-metismenu/health.svg)](https://phpackages.com/packages/onokumus-metismenu)
```

###  Alternatives

[onokumus/metismenujs

A menu plugin

13210.2k](/packages/onokumus-metismenujs)[kartik-v/yii2-widget-sidenav

An enhanced side navigation menu styled for bootstrap (sub repo split from yii2-widgets)

364.0M8](/packages/kartik-v-yii2-widget-sidenav)[sciactive/pnotify

Beautiful JavaScript notifications.

3.6k6.4k](/packages/sciactive-pnotify)[kartik-v/yii2-widget-rating

A Yii2 widget for the simple yet powerful bootstrap-star-rating plugin with fractional rating support (sub repo split from yii2-widgets)

444.1M8](/packages/kartik-v-yii2-widget-rating)[kartik-v/yii2-widget-timepicker

Enhanced Yii2 wrapper for the bootstrap timepicker plugin (sub repo split from yii2-widgets)

404.9M14](/packages/kartik-v-yii2-widget-timepicker)[kartik-v/yii2-widget-affix

A scrollspy and affixed enhanced navigation to highlight page sections (sub repo split from yii2-widgets)

153.8M3](/packages/kartik-v-yii2-widget-affix)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)