 |
| Create A Rollover Image Effect (change image on mouseover) |
First, i didn't know what it called? I just wanna make some effect when the cursor over to some image , it looks move or change with another image.
I read some articles on helplogger.blogspot.com and found "Create A Rollover Image Effect (change image on mouseover)" article.
So what is Rollover effect?
Rollover effect is one in which an image web object changes (swaps itself) on mouse over to another web object (called rollovers) and reverts back to the original image on mouse out.Demo :
(Place your cursor over the image bellow to see Rollover effect.)
Create A Rollover Image Effect
1.
You have the following code :<a href="URL ADDRESS"><img src="URL OF THE FIRST IMAGE GOES HERE" onmouseover="this.src='URL OF THE SECOND IMAGE GOES HERE'" onmouseout="this.src='URL OF THE FIRST IMAGE GOES HERE'" /></a>Change the color text as it follows :
Put your URL address here
URL ADDRESS = http://mr-obu.blogspot.com
The first image shown before you hovers over it
URL OF THE FIRST IMAGE GOES HERE=http://i1256.photobucket.com/albums/ii494/helplogger76/helploggerblogspotcomstickie3.png
The second image will appear after you hovers over it
URL OF THE SECOND IMAGE GOES HERE=http://i1256.photobucket.com/albums/ii494/helplogger76
Easy right?
Now, you can add the Rollover effect on your gadget or add it inside your post.
Enjoy Blogging!
