Dropdown Menu: Magic JavaScript

Usage

Add <link href="/PATH/TO/magic/stylesheets/dropdown_menu..css" rel="stylesheet">

below your <script type="text/javascript" src="/PATH/TO/magic/wand..js" charset="UTF-8"></script>
Add <script type="text/javascript">$m.wand.dropdown_menu = true;</script> inside your <body> tag.
Use the example below as a guide for building your own menus!

Example

<ul data-mjf="dropdown_menu" class="dropdown_menu" id="my_dropdown_menu"> <li id="section_1"><a href="#">Section 1</a> <ul> <li><a href="#">Link 1.1</a></li> <li><a href="#">Link 1.2</a></li> <li><a href="#">Link 1.3</a></li> <li><a href="#">Link 1.4</a></li> <li><a href="#">Link 1.5</a></li> </ul> </li> <li id="section_2"><a href="#">Section 2</a> <ul> <li><a href="#">Link 2.1</a></li> <li><a href="#">Link 2.2</a></li> <li><a href="#">Link 2.3</a></li> <li><a href="#">Link 2.4</a></li> <li><a href="#">Link 2.5</a></li> </ul> </li> <li id="section_3"><a href="#">Section 3</a> <ul> <li><a href="#">Link 3.1</a></li> <li><a href="#">Link 3.2</a></li> <li><a href="#">Link 3.3</a></li> <li><a href="#">Link 3.4</a></li> <li><a href="#">Link 3.5</a></li> </ul> </li> </ul>

« Back to the main documentation