You need to create a way for visitors to quickly navigate to the most popular pages on your site.
The function goToPage( ) takes the parameter url from the selected value in a form menu on the page. After checking to make sure that the value of the parameter is not empty (url != ''), the function assigns the value to the location property of the window object, causing the browser to load the new page.
A select menu (shown in Figure 3-9) gives site visitors a way to choose the page to jump to and invoke the function.
<form name="jmenu" method="post"> <select name="jchoices"> <option label="-Jump to another page-" value="" selected>-Jump to another page- </option> <option label="Widgets" value="http://yoursite.com/widgets/">Widgets</option> <option label="Doo-Dads" value=" http://yoursite.com/doodads/">Doo-Dads</option> <option label="Things" value=" http://yoursite.com/things/">Things</option> </select> <input type="submit" value="Go" onClick="goToPage(jmenu.jchoices.options[jmenu.jchoices.selectedIndex].value);return false;"> </form>
The onClick event handler in the submit button calls the function when the visitor clicks "Go" on the form. Both the form and the select menu have namesjmenu and jchoiceswhich will be needed to extract the value of the user's choice. The options property of any select menu in a form (here, jmenu.jchoices.options) is an array of sequential numbersstarting with zerofor each choice in the menu. The selectedIndex property is the one number from that array that matches the user's choice in the menu and the value property gives its value. So, when a user selects "Widgets," jmenu.jchoices.selectedIndex equals 1 and jmenu.jchoices.options equals http://yoursite.com/widgets/, the value that gets sent to the function.
Like a breadcrumb menu (see Recipe 3.7), a jump menu provides an alternative to the primary navigation that should be near the top of every page on your site. By combining your most popular pages in a menu, you can give visitors a snapshot of your site's offerings that cuts across the various sections on your site.
A good place for a jump menu is at the bottom of the page. There, it can provide a useful navigation tool to visitors who know where they want to go next on your site but don't want to scroll to the top of the page to find the link.