https://github.com/markconroy/zen_mobile_menu

A repo to hold code for my Zen Mobile Menu module.
https://github.com/markconroy/zen_mobile_menu

Last synced: 5 months ago
JSON representation

A repo to hold code for my Zen Mobile Menu module.

• Host: GitHub
• URL: https://github.com/markconroy/zen_mobile_menu
• Owner: markconroy
• Created: 2015-05-29T22:19:13.000Z (about 11 years ago)
• Default Branch: 7.x-1.x
• Last Pushed: 2015-05-29T22:53:58.000Z (about 11 years ago)
• Last Synced: 2025-02-16T00:25:55.728Z (over 1 year ago)
• Language: JavaScript
• Size: 113 KB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.txt

Awesome Lists containing this project

README

          
This is a very small module that makes default Zen sub-theme main menu be a bit more responsive. It does this by:

- Kicking in at 480px or less, then

- Hiding the menu items from display initially

- Removing the "element-invisible" class from the menu title so this can be used as the menu trigger

- Adding a class of "menu-trigger-unclicked", so you can use this to replace the text with a hamburger image or whatever you like (add a "+" before the word "Main Menu" perhaps)

- Adding a class of "menu-trigger-clicked" if the menu trigger is clicked, so you can use this to replace the text with a hamburger image or whatever you like (add a "-" before the word "Main Menu" perhaps)

- Slides the menu items into/out of view

- Sets each menu item at 100% width so they'll take up the full width of the phone (presuming it's a phone you are looking at the menu on), rather than displaying them lined-up beside each other

- Set the cursor to a pointer - we are using jQuery afterall!

There is not CSS included with this - styling of the menu is up to you - this just provides the functionality.