Share EfnWeb, LLC

Facebook MySpace Twitter Digg Delicious Stumbleupon Google Bookmarks 
Javascript - CSS - HTML nav buttons with page indicator PDF Print E-mail
Javascript nav button page indicator
(Figure 1)

Page indicator script (MSIE friendly). This script matches the file name of the browser location bar with one of the nav-bar links. If a match is found, the script changes the CSS class of the matched nav-bar button. In the case of the home page, if the location bar does not display the file name (domain only), the script assumes the directory default (index.asp, in this case).


Javascript indicator nav bar
(Figure 2)

Instead of graphics, the nav bar buttons (Figure 2) are generated with HTML (Figure 3) and CSS (Figure 4). Note that in this example, the HOME button's CSS class is changed from 'nav' to 'selected' with Javascript (Figure 1).


Javascript Nav Button Indicator HTML
(Figure 3)

Javascript Nav Button Indicator CSS
(Figure 4)