Dreamweaver Tutorials

Jump Menus

How to use the behaviors to create jump menus

Jump Menus

How to use the dreamweaver behaviors panel to create jump menus

In this tutorial you will learn how to use the Dreamweaver Behaviors Panel to create Jump Menus. Dreamweaver behaviors place JavaScript code in documents to allow visitors to interact with a web page to change the page in various ways, or to cause certain tasks to be performed.

Prerequisite Knowledge

This tutorial teaches you how to create jump menus using Dreamweaver behaviors and thus assumes you are familiar with some design software, even if you are new to Adobe Dreamweaver. However be assured that our detailed instructions can be followed by even a total novice.

You Are Here ::: Home >> Free Tutorials >> Dreamweaver Tutorials >> Jump Menus

This tutorial explains:

  • What is a Jump Menu?
  • How to insert and edit Jump Menus

What is a Jump Menu?

A Jump menu is a pop-up menu that can be included in a web page to list options that enable the site visitors to link to documents or files. It allows you to associate URLs with options in a pop-up menu list. By choosing an item from the list, the user is redirected (or "jumps") to the specified URL. You can create links to documents either in your own website or in other websites, e-mail links, links to graphics, or links to any file type that can be opened in a web browser. This contains three basic components:

  • A menu selection prompt, such as "Select:" (Optional)
  • A list of linked menu items which can be selected to open the linked document or file.
  • And a Go button (Optional)

How to insert and edit Jump Menus

Jump menus can be easily inserted into a webpage and the jump menu items can also be easily edited at a later time to change the list order or the file an item links to, or to add, delete, or rename an item.

For Example:


  1. Jump menus can be inserted in a web page by simply using the 'Jump Menu' form object (Insert->Form->Jump Menu).
  2. The 'Insert Jump Menu' dialog box appears, just fill out the text & URL for the jump menus and click OK.
  3. The Javascript coding for the Jump Menu is automatically included by Dreamweaver in your web document.
  4. To edit a Jump Menu, first select the jump menu object and then double-click the 'Jump Menu' in the Actions column of the Behaviors panel.
  5. Alternatively you can also use the 'List Values' button in the Property inspector to edit a jump menu.
  6. Save and test your file in a web browser. That's it you've learnt how to create Jump Menus using Dreamweaver Behaviors.

Software Required

Adobe Dreamwever (Macromedia Dreamweaver prior to version 8). Please check out the compatible versions listed in the box below. Since this tutorial series covers the core functions of Dreamweaver to create jump menu using Dreamweaver behaviors, mostly any version of these software should be fine.

Compatible Versions of Dreamweaver for this Tutorial

Dreamweaver CS6 Dreamweaver 4-8 | Dreamweaver CS3 | Dreamweaver CS4/CS5/CS6
Note: The instructions in this tutorial are same across all Dreamweaver versions listed above; Screenshot images (if any) may differ. Recommended Version: Dreamweaver CS6
Please like, +1, link to and share this SmartWebby resource if you found it helpful. Thanks!