Below is a simple rollover example. JavaScript enables us to use the onmouseover and onmouseout events to change our image's source on the fly. The rollover image is pre-loaded by the web browser upon the declaration of a new image using the Image() object.

It is also good to note that both images must be of the exact same width and height for this to work.

Note how our "gaurantee" from MSN Hotmail turns into an error due to too much traffic on the server.