<p>The MenuNav Node Plugin makes it easy to transform existing list-based markup into traditional, drop down navigational menus that are both accessible and easy to customize, and only require a small set of dependencies.</p>

<p>To use the MenuNav Node Plugin, simply pass a reference to the plugin to a Node instance's <code>plug</code> method.</p>

<p> <code> <script type="text/javascript"> <br> <br> // Call the "use" method, passing in "node-menunav". This will <br> // load the script and CSS for the MenuNav Node Plugin and all of <br> // the required dependencies. <br> <br> YUI().use("node-menunav", function(Y) { <br> <br> // Use the "contentready" event to initialize the menu when <br> // the subtree of element representing the root menu <br> // (<div id="menu-1">) is ready to be scripted. <br> <br> Y.on("contentready", function () { <br> <br> // The scope of the callback will be a Node instance <br> // representing the root menu (<div id="menu-1">). <br> // Therefore, since "this" represents a Node instance, it <br> // is possible to just call "this.plug" passing in a <br> // reference to the MenuNav Node Plugin. <br> <br> this.plug(Y.Plugin.NodeMenuNav); <br> <br> }, "#menu-1"); <br> <br> }); <br> <br> </script> <br> </code> </p>

<p>The MenuNav Node Plugin has several configuration properties that can be set via an object literal that is passed as a second argument to a Node instance's <code>plug</code> method. </p>

<p> <code> <script type="text/javascript"> <br> <br> // Call the "use" method, passing in "node-menunav". This will <br> // load the script and CSS for the MenuNav Node Plugin and all of <br> // the required dependencies. <br> <br> YUI().use("node-menunav", function(Y) { <br> <br> // Use the "contentready" event to initialize the menu when <br> // the subtree of element representing the root menu <br> // (<div id="menu-1">) is ready to be scripted. <br> <br> Y.on("contentready", function () { <br> <br> // The scope of the callback will be a Node instance <br> // representing the root menu (<div id="menu-1">). <br> // Therefore, since "this" represents a Node instance, it <br> // is possible to just call "this.plug" passing in a <br> // reference to the MenuNav Node Plugin. <br> <br> this.plug(Y.Plugin.NodeMenuNav, { mouseOutHideDelay: 1000 }); <br><br> }, "#menu-1"); <br> <br> }); <br> <br> </script> <br> </code> </p>

DEPRECATED. The MenuNav Node Plugin has been deprecated as of YUI 3.9.0. This module will be removed from the library in a future version. If you require functionality similar to the one provided by this module, consider taking a look at the various modules in the YUI Gallery http://yuilibrary.com/gallery/.