Quick Javascript Jump Menu

Development By: Aaron Ortega on February 5, 2010

When creating a user interface, using familiar objects is important. We aren’t trying to recreate the wheel after all. In your creations, you might find yourself in a position to use a <select> menu form element to allow your user to “jump” to different areas of an application, or to securely send them to a page with a different query executed without having to directly pass the variables through the form.

To achieve a quick javascript jump menu we will use the following code:

<form>
<label for="jumpmenu">Jump to: </label>
<select id="jumpmenu" name="jumpmenu" onChange="if(this.selectedIndex!=0) self.location=this.options[this.selectedIndex].value">
<option value="http://www.umbrella-media.comportfolio/">Our Portfolio</option>
<option value="http://www.umbrella-media.comservices/">Our Services</option>
<option value="http://www.umbrella-media.comblog/">Our Blog</option> </select>
</form>

That code will yield us a functioning javascript jump box. Enjoy!

No Comments »

No comments yet.

RSS feed for comments on this post. TrackBack URL

Leave a comment

Archive