Creating a Complex Roll-over menu in Dreamweaver 3

This is an example of a complex button roll-over menu. Let's examine how to create this. In order to build this effect, you'll need to make some elements:

1. Main buttons with alternate images which will appear when the mouse rolls over them
2. A Description graphic which has an alternate image which corresponds with each of the above buttons> NOTE: This should have a description of the relating link.

Once you've built these elements, go ahead and create your button bar. In this case we created a table with four cells across the top and a cell across the botton that spans the above four. Then, we created simple button roll-overs in each of the four top cells. Now, we ready to create the more "complex" component, the description graphic.

Step One: Place the original description graphic in the lower cell, and name it: "info"

Step Two: Select your first roll-over graphic, and open the behaviors menu.

Double click on the "Swap Image" action.

Step Three: Note that you see a list of possible images with their corresponding names. Next to the one which swaps is an "*". Click on "info." Then, click on browse and find the alternate description image which corresponds with the master button. In this case, we selected one associated with our "students" tag. Then click OK.

Step Four: Repeat this process for all the other images.

Step Five: Preview this in your browser and viola!