Welcome to the fifth part of a nine-part series that will show you how to build a browser menu. The aim of this series is to come up with a menu code that you can use with the majority, if not all, browsers without taking the particularities of a browser into consideration. We spent significant time on the previous parts on the layout; now we will get down to the code.
Functions for a Menu for All Browsers - Names of the Functions and their Roles (Page 2 of 5 )
The dropDownMenu() Function
This function displays a drop down menu. We can say it drops down a menu. It first displays the main table for the sub menus. This main table is transparent and has no border, so you do not see it. The function clears off any drop down menu or sub menu that was displayed.
The react() Function
When the mouse pointer goes over any drop down menu item or sub menu item, this function is called. It changes the background color of the cell from brown to firebrick. If the menu item has a '>' character, then the function produces a sub menu. The function also removes any drop down menu or sub menu that was displayed and is not supposed to be displayed now.
The remove2NumID() Function
This function is used to remove any table whose ID has a number part consisting of two digits. This function is called only under special circumstances; we shall see the details later.
The remove3NumID() Function
This function is used to remove any table whose ID has a number part consisting of three digits. As with the function above, it is called only under special circumstances; we shall see the details later.
The toChoose(ID) Function
When you click the BODY element, any drop down menu or sub menu must be removed. When you click a menu item (a drop down menu or sub menu), any drop down menu or sub menu should remain. However, when you click a menu item, the BODY element indirectly receives a click, meaning that the drop down or sub menu should be removed. This function sets a global variable that prevents that from happening. This is the only global variable we have in the code.
The removeSubMenu() Function
When the BODY element is clicked outside a drop down or sub menu, this function is called. It removes any drop down menu or sub menu that was displayed. The function first checks the value of the global variable to see if the click originated from a menu item or outside the sub menus (or drop down menus). If the click originated from a sub menu item, then the function does not take any action.
HTML 
More Top jQuery Plugins for Menus
