Creating a Common Browser Menu - Outline with Vertical Sub Menu Lists
(Page 4 of 4 )
In the above table, no item in a vertical list has a sub vertical list. However, in practice, some items in the vertical lists have sub vertical menu lists. The figure below shows how I handle this:
<DIV>
Sub link 00 | Sub Link 01 | Sub link 02 | Sub link 03 | Sub link 04 |
Sub link 10 | Sub link 11 > | Sub link 12 Sub Link 1112 | Sub link 13 | Sub link 14 |
Sub link 20 | Sub link 21 > | Sub link 22 Sub Link 1122 > Sub link 2122 | Sub link 23 Sub link 112223 | Sub link 24 |
Sub link 30 | Sub link 31 | Sub link 32 Sub Link 1132 Sub link 2132 | Sub link 33 Sub link 112233 Sub link 3433 | Sub link 34 > |
Sub link 40 | Sub link 41 | Sub link 42 Sub Link 1142 | Sub link 43 Sub link 3443 | Sub link 44 |
</DIV>
Understanding the way the links are placed and numbered is very important to understanding the code. The items present in the previous table are also present here. Each of the items that has a sub link has the ">" character at its end. As we can see from the figure, Sub link 11 has a sub vertical list; Sub link 21 has a sub vertical list, Sub link 1122, even though in a sub list, has its own sub vertical list; Sub link 34 has a sub list.
The sub list for the Sub link 11 menu item is:
Sub Link 1112
Sub Link 1122
Sub Link 1132
Sub Link 1132
This list is in the next column on the right. Identify the positions of each of these items in the table above.
The sub list for the Sub link 21 menu item is:
Sub link 2122
Sub link 2132
This list is in the next column on the right. Identify the positions of each of these items in the table above.
The Sub Link 1122 menu item is in a sub list derived from a drop-down vertical list. It also has its own sub list. The items in its sub list are:
Sub link 112223
Sub link 112233
This list is in the next column on the right. Identify the positions of each of these items in the table above.
The sub list of the Sub link 34 menu item is:
Sub link 3433
Sub link 3443
It is in the previous column on the left instead of the next column on the right. The reason for this is that Sub link 34 is in the last column. The philosophy is, if you are at the last column and you want a sub list, use the last-but-one column.
Identifying Further Sub Links
In menu parlance, the real menu is the main menu bar (the horizontal bar). Any menu (list) derived from this is known as a sub menu. A further sub menu, derived from a sub menu item, is still known as a sub menu. The items in the main menu are known as menu items. Any other item is known as a sub menu item, even if it is in a further sub list. I use the phrase "further sub list" or "further sub links" here, just for clarity.
A further sub link is identified by the number of its cell, preceded by the number of its root sub menu link. For example, Sub Link 1123 is identified by the number of its cell, which is 23, preceded by the number of its root’s sub link, which is 11. The sub link 112233, is identified by the number of its cell, which is 33, preceded by the number of its root’s sub link, which is 1122.
Let us take a break here. We continue in the next part of the series.
| DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware. |