DE Oracle @ UMUC Banner
Workshops

Search

Creating A Rollover

For this exercise you will need the following files (If you did not download the images needed for this part of the workshop, you need to do so before you can proceed. See Ex3.):

  • audio_up.jpg
  • audio_down.jpg
1. In the Design View window, place the cursor where the rollover image is to be placed. Select the image icon from the Common category of the Insert bar. If you do not see the Insert bar palette, select Window-->Insert.

2. The Select Image Source dialog box will appear. Navigate to the folder the images for the rollover have been stored. Select audio_up.jpg.

3. Select the audio_up image.

4. At this point, the images should be named. With the audio_up image selected, go to the Property Inspector panel and type in the name of the image. 

5a. Select Window-->Behaviors to open the Behavior Inspector panel. 

5b.The Behaviors Inspector panel will open.

6. Next, add a new action to the list by clicking on the plus (+) button.

8. Select Swap Image on the drop down menu box.

9. The Swap Image dialog box will appear. In the Images list, you will see a list of all the images that are in the current document. The audio image should already be selected. 

10a. Click on the Browse button and navigate to the folder where the audio_down image is stored. 

10b. Accept the default settings for preloading and restoring images. Click OK to close the Swap Image dialog box.

11. Now would be a good time to save your work. Press the F12 key on the keyboard to view the document in the default Web browser. You should see the audio_up image. 

When you move your mouse pointer over the audio_up image, the image should change to the audio_down image.

Blank Image


Welcome Page  How-To Page  Guidelines for Contributors
  WebTycho Login Academic Departments Directory
Administration Directory Faculty Services  Library Services 

Created and Maintained by the Center for Support of Instruction
© University of Maryland University College.