![]() |
Change
Image On Mouseover |
|
Change Image on Mouseover JavascriptThis is a small javascript that changes an image on mouseover. Run your mouse on the image above to see the rollover effect. The image contains a link and is a great script for any webpage. The mouseover script is also useful for those learning javascript. Have a look at the code and see how easy it is to follow. Works with most browsers, IE 4 and above. Not with netscape. Installation: STEP 1. Make 2 images which you would like to display. You can name them #1 and #2 if you wish and they can be jpg or gif format. Upload the images to your server. STEP 2 Copy the code
below and paste this between the <head> and </head> tags of your html
document. Point the script to where the images reside on your webhost. By this
I mean change image source lines: The lines in red should show where your images are stored and your image name. The example shows that my images are stored in the images folder and the names are rollover1.jpg and rollover2.jpg. You may need to use your full url such as http://wwww.yoursite.com/image1.jpg
STEP 3. Copy the code below and paste this into the body of your html document, where you want the images to appear on your webpage. Again
change the image source to suit at this line; img src="images/rollover1.jpg"
That's it. Good luck.
|
|