Superfish

Superfish integrates jQuery Superfish plugin with your Drupal menus.

Overview:

• Unobtrusive JavaScript.
• Keyboard-accessible, screen reader friendly.
• Multi-column sub-menus. (Megamenus)
• Easing effects with the jQuery Easing plug-in.
• Automatic sub-menu width calculation (Supersubs plugin), automatic sub-menu placement (Supposition plugin; prevents sub-menus from appearing off-screen.)
• Touch-screen compatible. (almost)
• Small-screen compatible. (<select> and vertical accordions)
• Window width (client-side) and UA string (client-side and server-side) detection for touch and small screen plugins, plus Modernizr support, but no CSS media-queries.
• RTL (Right-to-left) support.
• And a whole lot more...

Requirements:

• Drupal 8
  • Superfish library 2.x (Sample CSS & SCSS)
• Drupal 7
  • Superfish library 1.x (Sample CSS & SCSS)
  • JQuery 1.6.1 or higher, if you are going to use the jQuery Easing plugin.
• Drupal 6
  • Superfish library 1.x
  • jQuery 1.3.x or higher, through the jQuery_update module v2.x

Recommended additions:

• Libraries module
• jQuery Easing plugin (note that the file has to be renamed to jquery.easing.js before being uploaded to sites/all/libraries/easing)

Installation:

• Drupal 8
  1. Download the Superfish library and extract it somewhere like /libraries/superfish (so that the superfish.js will be located at http://example.com/libraries/superfish/superfish.js)
  2. Download and extract the Superfish module in /modules or /modules.
  3. Go to the Extend section of your Drupal administration back-end and enable "Superfish".
  4. Go to the "Block layout" page (under Structure) and use any of the "Place block" buttons to create a Superfish block. Use the "Configure" link of the block to configure it accordingly to your needs.
• Drupal 6 & 7
  1. Download the Superfish library and extract it somewhere like sites/all/libraries/superfish (so that the superfish.js will be located at http://example.com/sites/all/libraries/superfish/superfish.js)
  2. Download and extract the Superfish module in /sites/all/modules.
  3. Go to the Modules section of your Drupal administration back-end and enable "Superfish".
  4. Go to your blocks administration page; You will see several blocks called Superfish", move any of them to a region, use the "Configure" link of the block to configure it accordingly to your needs, and save.

  Drupal 6 users need to install jQuery_update module v2.x too.

Update

For update instructions please refer to the module documentation.

Pledge

#D8AX - I pledge to make this module as accessible as it can be. If you find any flaws, please submit an issue. Help me fix them if you can.

Donate to help make cancer history

Eat one less hamburger & give a donation to cancer research, thank you!