JavaScript Rollovers

A JavaScript rollover is used to swap an image with another image, usually when you move the mouse over the image.

Confused? Imagine you have 2 images as I have here:

 

example1          

 

But instead of showing both at the same time I want to show Image 1 first, and then Image 2 when I move the mouse over Image 1. Try it by moving your mouse over Image 1 below:

 

 

Why would you want a JavaScript Rollover? Mostly people use it to make their menus stand out better. Buttons that change color or shape can help the user see where they are about to click. But you can also use them to create fun effects. Take a look at the examples below:

 



 



What is it? - What do I need? - How do I do it? - Credits/F.A.Q.


Back to the Kasparius Tutorials Main Page