When applying CSS formatting to the section navigation for your Web site, you can specify the properties of the following classes either inline or in the global style sheet referenced by your wrapper:
- .navigationMenu: controls entire menu
- .navigationSubMenu: controls "nested" (indented) folders
- .navigationItem: controls individual items
One class controls each navigation item by means of <div> tags around the link.
CSS allows you to underline or highlight a button on rollover. But dynamic section navigation does not support Javascript rollovers. Without Javascript, you cannot have drop-downs or fly-out menus on rollover. In addition, there is no separate class defined for the "selected" state.
<div id=”navigation-ID” class=”navigationMenu”>
<!-- some combination of the following -->
<div class=”navigational”>Top-level Dynamic Label Text 1</div>
<div class=”navigationItem”>Top-level Dynamic Link Text 2</div>
<div class=”navigational”>Top-level Static Text 2</div>
<div class=”navigationItem”>Top-level Dynamic Link Text 3</div>
<div class=”navigationSubMenu”>
<div class=”navigationItem”>second-level Dynamic Link Text 1</div>
</div>
</div>