Creating Rollover Scripts

Image Rollover: First method

Rollover images are one of the most common techniques used in web sites. This is mouse-over effect that gives eye pleasing look for the site visitors. You need two images to do that, one for the Up state (original image when site load) and one for Over state (image that load when mouse cursor is over the image).

Select Insert -> Image Objects and click on Rollover Image and a window will appear:

Choose a name for you image rollover and type it in the Image name field.

Use the Browse button to select an image that will be original and a rollover image that original one will be swapped with when the mouse curser is over the image.

Leave "Preload rollover image" option selected as default.

In the "Alternative test" type a descriptive name of the image. This text will be displayed when the mouse cursor is over the image.

In the last field type the link to the page that you want to be loaded when the image is clicked.

Click on OK and rollover image will be created. You can use this technique to create a nice looking rollover buttons.

Image Rollover: Second method

Insert you image where you want it to be on your page. Do that from Insert -> Image or use 'Insert Image' button.

Select your image and name it from Properties panel:

Select Window -> Behavior to open up Behavior property window. Click on the + sign and from the dropdown menu select Swap Image option.

A window appears where you will see a list of names applied to your images. Choose the name of the image on which you want to apply behavior. Use Browse button to select a rollover image. When you are ready leave Preload images option enabled and click on OK button.