Concluding a Menu for All Browsers
(Page 1 of 4 )
At last we have a web page menu code that can be used for any browser without any of its code segments being specific to any particular browser. I called the design approach of the previous series the Simple Layout Approach. I call the design approach in this series the Elaborated Layout Approach. In this last part of the series I give you a summary of the two design approaches. I also give you the advantages and disadvantages of the two approaches. Everything in these two series is my conception.
Introduction
The aim of these two series is to come up with web page menu code that can be used by all browsers, without any of its code segments being specific to any particular browser. We have achieved this, from a practical point of view.
Simple Layout Approach
The Layout
We look at the summary of the Simple Layout Approach here. The main menu (horizontal bar) is in a single row table. You have another table of rows and columns for the sub menus. A link is in a SPAN element. You can have more than one SPAN element in a cell, but only one can be shown at a time. A sub menu is displayed by showing SPAN elements in consecutive table cells in a column.
You have three other tables having the same structure as the table for the sub menus. One of the tables is called the Copy Table, another is called the Boolean table and the third is called the Number table. The value of the display property of these three tables is "none." So they are not seen on the web page.
The Copy table holds copies of the SPAN elements at their original states. None of the SPAN element at its original state can be seen. Whenever you need to clear the table for the sub menus, you just make a copy of the corresponding SPAN elements from the copy table to the table for the sub menus.
For each cell showing a SPAN element, the corresponding cell in the Boolean Table has the content "true." The JavaScript code uses this in order to show or remove sub menu items. For each cell showing a SPAN element, the corresponding cell in the Number table has the number part of the ID of the SPAN element. The JavaScript code uses this in order to show or remove sub menu items.
Next: Important Attributes >>
More HTML Articles
More By Chrysanthus Forcha
