Usage
Create a menu initialization script file to share
Because most pages on your website will probably use the same items in the
menu for many pages, you will probably want to create a separate script file
just for initializing the items in the menu, and then include that file on each
page that will show the menu.
Create a text file named "initmenu.js" (or any name you prefer). In this
file, you'll begin by creating a Menu object, like this:
var mMenu = new Menu();
At this point, you can either begin setting properties to affect the overall
display of the menu, or you can begin adding items to the menu. Let's begin by
adding items to the menu.
To create a Link item, use the CreateLink method of the main Menu object,
like this:
var mMenuA = oMenu1.CreateLink();
mMenuA.displayHtml = "Contoso Home";
mMenuA.href = "http://www.contoso.com";
mMenu.AddItem(MenuA);
Once the Link object is created, add it to a menu with the AddItem method of
the Menu.
To create an Action item, use the CreateAction method of the main Menu
object, like this:
var mMenuB = oMenu1.CreateAction();
mMenuB.displayHtml = "Action B";
mMenuB.action = "window.alert('Action B clicked');";
mMenu.AddItem(mMenuB);
Once the Action object is created, add it to a menu with the AddItem method
of the Menu, just like with a Link item.
To create a child Menu item, use the CreateMenu method of the main Menu
object, like this:
var mMenuC = oMenu1.CreateMenu();
mMenuC.displayHtml = "Menu C";
mMenu.AddItem(mMenuC);
Once the Menu object is created, add it to a menu with the AddItem method of
the Menu, just like with Link and Action items.
To add more Link items, Action items, and more child Menu items to a child
Menu object, use the child menu's AddItem method, like this:
var mMenuC_1 = oMenu1.CreateLink();
mMenuC_1.displayHtml = "Feedback";
mMenuC_1.href = "http://www.contoso.com/contact/";
mMenuC.AddItem(mMenuC_1);
This adds a Link item to the child menu mMenuC, which was already added to
the menu Menu object, mMenu.
Now that you have added all of the items you want to the main Menu object,
save and close the file initmenu.js.
For each page with the menu
There is one required file: menu.js. Include it on each page that will show
the menu, like this:
<script src="menu.js" type="text/javascript"></script>
Next include the file you just created to initialize the menu, like this:
<script src="initmenu.js" type="text/javascript"></script>
Finally, at the location where you want the menu to appear, call the main
Menu object's Render method, like this:
<script type="text/javascript" language="javascript">
mMenu.Render();
</script>
That's all it takes to display the menu on each page.
The additional features available for the Menu object are listed in the
Reference section.
|