Rollovers

Main >> Content >> Tutorials >> HTML >> Rollovers

Rollover is a cool effect you can use on pictures you want to have as a link.


Step 1: Start by making two pictures you want to use. Here's the two I've made (I know they are not good, they were ment to be funny:)).


Step 2: Copy the code under and paste it on the page you want to have the rollovers.
<a href="PAGEURL" onMouseOver="document.image1.src='second image'" onMouseOut="document.image1.src='starting image again'"> <img src="starting image" name="image1" border="0"> </a>

Step 3: Paste your first URL in the code where it says Starting image and image1. Then paste the second image URL where it says second image.

Step 4: If you've done everything correct your rollover should look something like this: