Example menu using simple style
Example using codrops' Multi
Example using Mean Menu
Example using Sidr
Example using Google Nexus
Responsive Menus admin form

Overview

Responsify your menus! Just give me a CSS/jQuery style selector of your menu and I will make it mobile friendly (when the time is right).

Technically you could set this to affect any element on the page... e.g. collapse a sidebar or content area at a certain screen width.
(Using certain styles).

Drupal 10 status

It can be installed on D10 by using the 2.0.x version.
Please report any issues with D10 to the new branch number and let's get it working well.

Features

  • Choose from different responsive menu styles.
  • Configure any amount of menus to be responsified (certain styles have limitations).
  • Configure at which screen width they should be handled.
  • Include / exclude admin pages. (more options with Context)
  • Disable other mouse events.
  • Remove other classes/IDs.
  • Context module integration.
  • Easily theme-able.

Responsive Menu styles:

Screenshots in same order as this list:

  1. 'Simple', a lightweight style.
  2. codrops' Responsive Multi-Level Menu*
  3. MeanMenu
  4. Sidr*
  5. codrops' Google Nexus*
  6. Next? Open a feature request ticket if you find a style that belongs here.

Items marked with '*' require Libraries 2.x unless you use hook_responsive_menus_styles_alter() to include your own path to files. More details in README.txt

Other styles I would like to add in the future based on interest:
FlexNav
SlimMenu
Flip Menu
Slick Nav
Radial Responsive - This one is interesting, but is it responsive?

Similar Projects

Responsive Navigation
Mobile Navigation

Compatibility

Should work in all major browsers and IE 9+
Varies between styles - usually for the better (meaning some work in IE 8 or older versions).

  • Menu Attach Block: Put blocks in your menus.
  • Context: Use more advanced display rules, or multiple responsive menu configurations.

Requirements

None.
Optionally integrates with Context, Libraries 2.x, & jQuery Update modules.

Good to know

Note about codrops' Multi style:
Will only be applied on page load, so it must meet the width requirement at that time (no browser-dragging to test).

Must clear caches after downloading a library (style plugin)
This is just a requirement of the libraries module.

See responsive_menus.api.php in the module folder for hooks & examples of integrating your own library, loading existing ones differently, or removing requirements of a library.

Interested in helping out? See: #2257371: [meta] ROADMAP / Next release items

Note on updating to 7.x-1.7

This will remove HTML / JS in your menu toggle button text. If that breaks things for you, and only trusted accounts have access to "administer responsive menus", then you are fine to stay on 7.x-1.6.

Supporting organizations: 
D8 port

Project information

Releases