Mega menus are a type of drop-down, which seeks to overcome some of the usability drawbacks of traditional drop-downs. Hierarchy of your navigation is made visible all at once and the amount of clicking, searching, and navigating is reduced.
This module allows you to build mega menus by leveraging jQuery and the existing Drupal menu system. Megamenu takes a Drupal menu that is 3 levels deep, and converts it into a categorized 3-level mega menu, which is placed into your site as a block.
What's the deal with Megas?
What does this module do?
- Turns a Drupal menu into a Mega Menu
- Solves the "diagonal problem" (menus do not immediately disappear when the mouse moves away from the parent menu item, or moves between panes)
The module provides classes and ID's that allow for a full-range of styling customization, from more traditional (but multi-level) drop-downs to full width slide out menus.
A couple demo skins are supplied, but these are purely for instructional purpose to help get you started with theming your mega menu. Currently, you should have an understanding of how Drupal overrides module CSS files and how to add CSS to themes, in order to provide your own styles in your particular theme.
If you simply enable this module and select an included skin, your menu will likely look odd or broken. This is because Drupal loads module CSS files load before theme CSS files. To remedy this, copy the skins' CSS code into your theme, and make sure you haven't declared more specific rules in your other stylesheets.
Extend with these modules
- Taxonomy Menu: Can be used as a source menu for this module, which displays taxonomy trees as a Mega Menu
- Special Menu Items: Can be used to make slot titles and menu items into non-links. Note: This isn't really a recommended module, but we had a feature request to make Megamenu work with it..
- Menu Icons: Can be used to add icons next link items.