Skip to content

Instantly share code, notes, and snippets.

@acdha
Created February 9, 2009 20:23
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save acdha/60961 to your computer and use it in GitHub Desktop.
Save acdha/60961 to your computer and use it in GitHub Desktop.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>YUI Nested Menus</title>
<!-- YUI Configurator: http://developer.yahoo.com/yui/articles/hosting/?menu&yuiloader&MIN -->
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/combo?2.6.0/build/base/base-min.css&amp;2.6.0/build/menu/assets/skins/sam/menu.css">
<script type="text/javascript" src="http://yui.yahooapis.com/combo?2.6.0/build/yahoo-dom-event/yahoo-dom-event.js&amp;2.6.0/build/container/container_core-min.js&amp;2.6.0/build/menu/menu-min.js"></script>
<script type="text/javascript" charset="utf-8">
function init_menu() {
var departments = [
{
text: "Accounting",
submenu: {
id: "accounting",
itemdata: [
{ text: "Department-Wide", checked: true },
{ text: "Capital Expenses" },
{ text: "Investment" },
{ text: "Travel Expenses" }
]
}
},
{
text: "Sales",
submenu: {
id: "sales",
itemdata: [
{ text: "Department-Wide" },
{ text: "Pre-Sales", checked: true },
{ text: "Educational" },
{ text: "Government" },
{ text: "Corporate" },
{ text: "Small Business", checked:true }
]
}
}
];
var deptMenu = new YAHOO.widget.Menu("CF-Departments");
deptMenu.addItems(departments);
deptMenu.render("menu_container");
deptMenu.subscribe("click", menu_click_handler);
YAHOO.util.Event.addListener("menutoggle", "click", deptMenu.show, null, deptMenu);
deptMenu.show();
}
function menu_click_handler(p_sType, p_aArgs) {
var oDOMEvent = p_aArgs[0];
// TODO: Update list of checked items?
}
</script>
</head>
<body onload="init_menu();" class="yui-skin-sam">
<p>
<button id="menutoggle" type="button">Show Menu</button>
</p>
<div id="menu_container"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment