Multiple event rollovers can be somewhat tedious and complex to set up but can be very useful and produce some very stunning effects. This tutorial sets up a multiple event rollover in DreamWeaver MX (but this will also work in DW 4 & DW 3 -- earlier versions I'm not certain about).

Click here for an example.

You'll see that when you roll-over one of the menu buttons three things happen. 1) the button changes from black to red, 2) a picture appears underneath the buttons and 3) a description of the picture appears below it.

This is an example of a multiple event roll-over. While in this example all three images are relatively close together, they do not have to be. They can be anyplace on the page -- as long as they're on the same page -- which is the only requirement.

Okay, so first off we're going to construct a page so it looks like what is wanted. This one is a table of 5 columns by 3 rows. The cells on the top are for buttons and two larger merged cells to underneath for our text -- again, this technique works anywhere you want images to change on your page so don't think you have to keep it in one table or something like that.

Here we're merging the files:

Next we'll insert the buttons I previously made for this example into the top 5 cells.

Next Page