Javascript Drop Down Menu Example

This is a very simple example of a javascript dropdown menu, using the form tags and option buttons:

 

 

In the head section of your document, place the following javascript function: 

<script type="text/javascript">
function dropdown()
{
location=document.forms[0].links.value
}
</script>

And then in the body section, place the following code where you want the menu to be:

<form>
<select id="links" onchange="dropdown()">
<option>-Select location-
<option value="http://www.siskiyous.edu">COS Home Page
<option value="calendar.htm">CSCI 12 Calendar
<option value="project.htm">CSCI 12 Project
</select>
</form>

You will need to substitute your URLs and words to display in the option boxes.  This script works by passing the value (URL) to the dropdown function when the web user chooses an option (onChange).  The location command acts as the anchor tag.

 

Javascript Menu Example #2 ( a little more complicated)

Javascript Menu Example #3 (very complicated)

 

All examples courtesy of w3schools.com http://www.w3schools.com/dhtml/dhtml_examples.asp . Scroll down to menu section.

Another interesting Javascript menu example: http://www.surflocal.net/MedfordOR/     Notice how the menu (on the left) moves when you scroll down the page.