The Digital Research Initiative
The University of North Carolina at Chapel Hill

JavaScript for any occasion

Navigation

Pulldown Menus

Pulldown menus can be essential to navigation, taking up less space than a traditional site map or image map. You can make the server do less work by wiring JavaScript to the pulldown menu. There are two ways you can do this: with and without a GO button.

With a go button it's really easy. Put this script anywhere in the <body>.

<form>
<select name="list">
<option selected value="your first URL">WebSite 1
<option value="your second URL">WebSite 2
<option value="your third URL">WebSite 3
</select>

<input type=button value="Git It!" onClick="top.location.href=this.form.list.options[this.form.list.selectedIndex].value"> </form>

Here it is in action (be sure to come back):

 

Without the GO button it's even cooler. It will automatically transport the user to which ever site by just clicking the menu. Put this part of the script in the <head>.

<script>
<!-- 
function doArray() {
  var arylnth = doArray.arguments.length;
  for ( i = 0 ; i < arylnth ; i++ ) { this[i]=doArray.arguments[i] }
}
function newFile() {
  var choose = eval(document.file.site.selectedIndex);
  if( (choose > 0) && (choose < 14) ) {
  var section=new doArray( 'URL 1', 
        'URL 2',
        'URL 3');

location=section[document.file.site.selectedIndex];
      }
    }
// -->
</script>

Place this next snippet of code where you want the pulldown menu to show up.

<form name="file">
<select name="site" onChange="newFile();" Align="left">
<option selected>Website 1
<option>Website 2
<option>Website 3
</select>

And here is an example taken from my own homepage. I use this type of pulldown menu at the top of every page.

And if you still have any doubts about how powerful JavaScript can be when done right, click either "Chernoffism" or "Terminology". A JavaScript menu opens up a JavaScript controlled window filled with content determined by a JavaScript Transmogrifier Engine. You'll instantly be the envy of all web weenies and computer geeks.


This site made by

By the time I get to Arizona...

This site was created especially for students of the UNC School of Journalism's
JOMC 050 Class, and anyone else who may be interested.
For more information, please contactdaikat@email.unc.edu
Last Updated: Thursday, 10-Dec-1998 13:05:04 EST