Q & A: Answer

How do I make a drop-down link box?

A drop-down link box allows your visitors to choose from a list of options, each of which takes them to a different page. An example can be seen on this very page, in the form of the HTML Guides links on the right hand side of the screen. I'll use this example in my answer.

There are probably many methods of doing this, but I use JavaScript. The box itself is created with form coding where the VALUE attribute of the OPTION tags has been set to the path of the documents:

<FORM NAME="quickfind">
<SELECT NAME="topics" onChange="go()">
<OPTION VALUE="NONE">Select a Topic...
<OPTION VALUE="NONE">---------------------------
<OPTION VALUE="/htmlcentral/basics/">Basics
<OPTION VALUE="/htmlcentral/guides/links/">Links
<OPTION VALUE="/htmlcentral/guides/images/">Images
<OPTION VALUE="/htmlcentral/guides/tables/">Tables
<OPTION VALUE="/htmlcentral/guides/lists/">Lists
<OPTION VALUE="/htmlcentral/guides/frames/">Frames
<OPTION VALUE="/htmlcentral/guides/forms/">Forms
<OPTION VALUE="/htmlcentral/guides/css/">Style Sheets (CSS)
</SELECT>
</FORM>

When the value of the drop-down box is changed, the JavaScript function named "go" is executed. The code for this function is shown below and should be placed in the HEAD section of your page:

<SCRIPT LANGUAGE="JavaScript">

<!--
function go(){
if (document.quickfind.topics.options[document.quickfind.topics.selectedIndex].value != "NONE") {location = document.quickfind.topics.options[document.quickfind.topics.selectedIndex].value}
}
-->

</SCRIPT>

What this does is first checks that the user hasn't chosen a dudd option, so that selecting the "Select a Topic" option doesn't have an effect. If a valid option has been chosen, the browser is sent to the appropriate page. You don't have to understand it completely, just plug it in and set it to work. That's the joy of JavaScript!