Changing Navigation Tabs

This section describes how to customize the Waveset navigation bar.

Customizing the Waveset User Interface Navigation Bar

The Waveset User Interface implements a second XPRESS form that contains the navigation bar. This means that the rendered page has two <FORM> tags, each with a different name attribute:

<form name="endUserNavigation">

and

<form name="mainform">

When you insert JavaScript code into the Waveset User Interface navigation bar, be sure that you are referring the correct form. To do so, use the name attribute to specify which <FORM> tag you want to reference: document.mainform or document.endUserNavigation.

Customizing Navigation Links

Copy and edit the following code to customize the navigation links across the top of the page. Change the background-color to an appropriate color.

Example 8–1 Customizing Navigation Links

* LEVEL 1 TABS */
.TabLvl1Div {
	background-image:url(../images/other/dot.gif);
	background-repeat:repeat-x;
	background-position:left bottom;
	background-color:#333366;
	padding:6px 10px 0px;
} 
a.TabLvl1Lnk:link, a.TabLvl1Lnk:visited  {
	display:block;
	padding:4px 10px 3px;
	font: bold 0.95em sans-serif;
	color:#FFF;
	text-decoration:none;
	text-align:center;
}
table.TabLvl1Tbl td {
	background-image:url(../images/other/dot.gif);
	background-repeat:repeat-x;
	background-position:left top;
	background-color:#666699;
	border:solid 1px #aba1b5;
}
table.TabLvl1Tbl td.TabLvl1TblSelTd {
	background-color:#9999CC;
	background-image:url(../images/other/dot.gif);
	background-repeat:repeat-x;
	background-position:left bottom;
	border-bottom:none;