Wisdom.DropDownMenuAdvanced


A multi-level drop down menu supporting styled recursive drop-down/fold-out sub-menus. A DropDownMenu is a commonly-used navigational component that provides drill-down access to functionality or content.

I personally don't recommend using them, as they lead to all sorts of complexities when it comes to handling client devices with alternative input mechanisms, but demand has been vehement enough, that we've had to provide one...

NOTE: In the terminology used in this class, a "menu" is usually a UL element (unordered list) and it's associated child list items (LI elements).

found in: lib/DropDownMenuAdvanced/DropDownMenuAdvanced.js

module: wisdom.ui

dependencies:

  • wisdom
  • wisdom.ui
  • wisdom.console
  • A particular HTML element structure, documented below
  • CSS snippets in lib/DropDownMenuAdvanced/DropDownMenuAdvanced.css

construction:

event-handling functions:

  • wisdom.implementation.menuMouseOver()
  • wisdom.implementation.menuMouseOut()

helper functions:

  • wisdom.ui.getCurrentOpenMenu()
  • wisdom.ui.hasSubMenu(element)
  • wisdom.ui.getSubMenus(element)
  • wisdom.ui.menuIsOpen(element) : Boolean
  • wisdom.ui.openMenu(element)
  • wisdom.ui.closeTopMostMenus()
  • wisdom.ui.closeAllMenus()

internal implementation:

  • wisdom.implementation.openMenus[]: an array of ...
  • wisdom.implementation.topLevelMenuElement: a reference to the top level menu element (this.element)

See also


This is part of the Reference Documentation for the Wisdom Javascript Library? (or wisdom.js)