ResponsiveCSSMenu.fwaction (2014-06-27) (Downloaded 601 times)
Compatible: Pro 6
Author: Walter Davis
Make a CSS menu for your Backdraft site that responds to the breakpoints you’ve set for your layout. When you scale down below the smallest “large screen”, you get a screen-space-preserving “hamburger” menu button.
Apply the Action in a similar manner to the Freeway-provided CSS Menus Action: draw an HTML box, apply the Action, and type your menu items inside the box as an unordered list. To create submenu options, simply enter your secondary options as a sub-list (use the indent arrow buttons in the Inspector to adjust the hierarchy).
Important difference between this Action and the CSS Menu Action – none of your menu options may be left without links. If you have a menu text item, it must link somewhere. (This is just good user experience practice anyway – particularly important for mobile devices, which do not have a cursor for mouseover events to do anything – but the CSS Menu lets you get away with this faux pas as a design preview convenience. Responsive CSS Menu does not have this feature.)
It is also important to set the HTML box that you use as the menu to a fixed height (not the default minimum-height).
This Action only creates horizontal menus with vertical drop-down options, by design.