How to Create a Rollover Link in Adobe Dreamweaver
Adobe Dreamweaver can be overwhelming, but making a rollover image or link is very simple. Rollovers are a great way to enhance your website. Rollovers show one image on the site, then as the viewer scrolls his mouse over the image, another image appears. A rollover image can reveal another image or it can link to another URL. Read on to learn how to create a rollover link in Adobe Dreamweaver.
Instructions
-
-
1
Open a new Dreamweaver page.
-
2
Click where you want to insert the rollover image.
-
-
3
There are two ways to insert a Rollover Image. One way to do this is from the menu bar at the top, click on "Insert > Image Objects > Rollover Image." Or another way, you can click on the "Common Tab (on insert bar) > Images > Rollover Image." A new menu box called "Insert Rollover Image" will appear.
- 4
-
5
Browse through your computer to find the top image or "Original Image." Do the same for the bottom image or "Rollover Image."
-
6
Click "Preload Rollover Image" to have the image load when the rest of the page loads, so there are no delays in loading time for your viewers.
-
7
Type in "Alternate Text" another name for this image, for people who use text-only browsers and won't view your images.
-
8
Enter a URL in the "When Clicked, Go To URL." A URL is a web address, like: http://www.ehow.com/. Only enter a URL if you want the rollover to link somewhere, otherwise it is unnecessary.
-
9
Click "OK". You've created a rollover image/link.
-
1
Tips & Warnings
The original image will be seen first, when the mouse is scrolled over the rollover image will appear.
Use all lower-case letters to ensure there are no problems with the pages code.
You will not be able to see the rollover image rollover in Dreamweaver. Once you view your page in a browser, it will work.