JS-vault. DOM Image rollover.

Image rollovers script

Image rollovers represent the classic and "timeless" JavaScript effect. Well, this DOM script makes the process of adding them as simple as can be, by allowing you to apply a rollover to any image through just the insertion of a custom attribute (hsrc) inside the image's tag.

This script works in all DOM (Document Object Model) compliant browsers- IE5+, NS6+, Opera 6+, Mozilla etc. All other browsers will simply see no effect. And unlike conventional image rollovers, the image does not have to be hyperlinked in order for the effect to work.

Place the code anywhere inside the <head> section of your page:

To now give any image a rollover effect, just insert the custom HTML attribute "hsrc" into the image's tag, using the swapped image's path as the attribute's value:

<img src="../images/ball.gif" hsrc="../images/ball-over.gif" border="0">

Image rollovers script

Test the script