DropDown Menu: Text Links
Menu Demo with Text Links
Calling the Script
This menu uses the following call to the DropDown Menu script:
buildMenu("h","t","»","2");
The options used here tell the script to render the following menu:
- "h" = horizontal main menu
- "t" = text links for the main menu, no bullets used
- "»" = use a list indicator of (») which is HTML encoded with (»)
- "2" = select main menu item two for highlighting
Defining the Links
All links in the menus require two items to be defined in the data file, the (td) and the (url). If the menu item is only supplied to open another menu, then the link address (url) does not need to be defined.
The first parameter (Required) looks as follows: td_# = "Item Caption"
The second parameter (Optional) looks as follows: url_# = "Item URL"
-
Relative URL example: (address on same server)
url_# = "/services/third.html" -
Absolute URL example: (address on another server)
url_# = "http://www.example.com/services/third.html"
The pound symbol (#) would be replaced with the apporpriate directory depth values for each particular link. These examples should help:
-
The third item of the main menu would be coded with: td_3 and url_3.
-
The second item of a submenu for the fourth item on the main menu would be coded with: td_4_2 and url_4_2.
If the (url) parameter is present, a click of the mouse will open the new page.
When you define your colors and menu widths in the style sheet, you need to also define these colors in the menu data file. Just be sure to replicate the values from the style sheet to this file.
|
var tdColor = "#fefefe"; // menu item text color, hexidecimal var tdBgColor = "#993366"; // menu item background color, hexidecimal var hlColor = "#ffff00"; // highlight text color, hexidecimal var hlBgColor = "#cc6699"; // highlight background color, hexidecimal var cellWidth = "150"; // width of sub-menu drop lists, in pixels |
