Syntax Breakdown

This application is contained in a frameset with a number of files. Here is a quick rundown:

index.html

Top level; holds the frameset and top-level variables

top.html

Displays Select List JavaScript header

nav.html

Displays the page links

background.html

Changes background colors

multiselect.html

Populates one select list based on selections in two others

urldirectory.html

Loads search engines based on select list option

help/background.html

Help document associated with background.html

help/multiselect.html

Help document associated with multiselect.html

help/urldirectory.html

Help document associated with urldirectory.html

help/help.js

JavaScript source file.

It’s not likely that you’ll want to get neck-deep into the logic behind all that that select list functionality in background.html , multiselect.html, and urldirectory.html. It’s really easy to pick up, and that isn’t what this chapter is about. Make sure you at least take a look at repopulating select lists in multiselect.html, though. It is handy. Instead, let’s make our way through this in two steps:

  1. Context-sensitive help: loading the right document in the help window (in nav.html )

  2. Showing and hiding the extra information: getting the mouseovers running (in help/help.js )

Context-Sensitive Help

This one is pretty easy. It all happens in nav.html. Example 11.1 shows the code.

Example 11-1. nav.html

 1 <HTML> 2 <HEAD> 3 <TITLE>top.html</TITLE> 4 </HEAD> 5 <STYLE TYPE="text/css"> ...

Get JavaScript Application Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial