Example « Documentation

Example for jsDOMenuBar Version 1.1

Suppose you wish to make a menu bar with two menu bar items, and each menu bar item has a main menu. Open jsdomenu.inc.js. You should see the following:

function createjsDOMenu() {
	
}

We define a main menu for the first menu bar item, and called it mainMenu1:

mainMenu1 = new jsDOMenu(130);

Next, we add in some menu items and separators:

with (mainMenu1) {
  addMenuItem(new menuItem("Item 1", "", "example.htm"));
  addMenuItem(new menuItem("Item 2", "", "example.htm"));
  addMenuItem(new menuItem("-"));
  addMenuItem(new menuItem("Item 3", "", "example.htm"));
  addMenuItem(new menuItem("Item 4", "", "example.htm"));
}

Similarly, we define a main menu for the second menu bar item, and called it mainMenu2. We also add in some menu items and separators:

mainMenu2 = new jsDOMenu(150);
with (mainMenu2) {
  addMenuItem(new menuItem("Item 1", "", "example.htm"));
  addMenuItem(new menuItem("-"));
  addMenuItem(new menuItem("Item 2", "", "example.htm"));
  addMenuItem(new menuItem("Item 3", "", "example.htm"));
  addMenuItem(new menuItem("-"));
  addMenuItem(new menuItem("Item 4", "", "example.htm"));
}

Next, we define a menu bar, and called it menuBar:

menuBar = new menuBar();

We add in the two menu bar items to menuBar, and assign mainMenu1 to the first menu bar item, mainMenu2 to the second menu bar item:

with (menuBar) {
    addMenuBarItem(new menuBarItem("Item 1", mainMenu1));
    addMenuBarItem(new menuBarItem("Item 2", mainMenu2));
  }

Finally, we move the menu bar to the position we want. Suppose we want it to be 10px left, 100px right:

menuBar.moveTo(10, 100);

View the example demo based on the above codes.

Back to Documentation


Compiled on 16 January 2005.

The latest version is available at http://www.tohzhiqiang.per.sg/projects/jsdomenubar/docs/example.php.