Usage
The Drop-down Navigation object does not insert the drop-down control into
your web page. You must do this step yourself. There are two simple ways to do
this.
The first way is to use the FrontPage editor. Open your web page in
FrontPage. Move your cursor to the point where you want the drop-down navigation
object. Click the Insert menu, select the Form menu item, and then select the
Drop-Down Box menu item. This inserts a drop-down control at your cursor's
location on the web page. It also inserts a Form and two buttons: a Submit
button and a Reset button. You may safely delete the Submit and Reset buttons
(unless you plan to use them on your web page). However, you should not remove
the form from the page. Now you need to give the drop-down box an id attribute.
Select the newly inserted drop-down box, then click the Format menu, then select
the Properties menu item. This displays a dialog box labeled "Drop-Down Box
Properties." Click the Style...button. This displays a Modify Style dialog box.
In the text box labeled "ID:", enter a unique name for this drop-down box
control, such as "ddnMain". Click OK to close this dialog box, and click OK
again to close the first dialog box.
The other way is to insert the HTML for the drop-down control manually.
Insert this code into the HTML source for your web page at the location where
you want the drop-down navigation object to appear:
<form>
<select id="ddnMain">
</select>
</form>
Note that if you already have a Form element on your page, you do not need to
add these form tags as long as the select element is inside the form.
There is one required file: dropdownnav.js. Include it on your page with a
line like this:
<script type="text/javascript" src="DropDownNav.js"></script>
Then, to use the Drop-down Navigation object, create an instance of it and
attach it to the drop-down box control, like this:
<script type="text/javascript">
ddn = new DropDownNav();
ddn.Attach ("ddnMain")
The order that you add items to the Drop-down Navigation object is important.
Items will appear in the drop-down box in the order that you add them to the
Drop-down Navigation object. A useful item to add first to the Drop-down
Navigation object is an instruction for the user to click on the drop-down box
in order to go to a new page, like this:
ddn.AddInstruction("Select a destination...");
Next, add as many navigable locations as you like to the Drop-down Navigation
as you need, like this:
ddn.AddNavigation ("Contoso Ltd.", "http://www.contoso.com");
You can also add more instructions and separators as well as locations. When
the page is displayed in the user's browser, it will display all of the items
you've added to it. If the user selects one of the locations from the list, the
web browser will change its address to the new location.
|
