Rollover images

You can insert rollover images in your webpage. A rollover image shows a second image when your mouse is rolled over it. These images are particularly useful as button images, when you want to show the option that a button offers.

To insert a rollover image:

1. Click on the intended location of the image on the webpage.
2. Select Insert > Image Objects > Rollover Image.

Insert menu with 'Image Objects and 'Rollover Image' highlighted

You will need to fill in the following information for each rollover image:

• Image - a name for this image.
• Original image - the location of the original image.
• Rollover image - the location of the rollover image (when the mouse is placed over the original image).
• Preload rollover image - check this box (this will tell the web browser to download both images at the same time, meaning that when the user puts their mouse over the original image, there will not be a delay in displaying the rollover image).
• Alternate text - text that will appear when the user places their mouse over the image. Also, this text is important for accessibility - it allows blind users who may use a text-based browser to get a description of the image or button.
• When clicked, go to URL - where this rollover image will link to.

Insert Rollover Image property box