Image Rollover with Javascript

Xah Lee, 2005-06, 2010-10-21

Advertise Here For Profit

This page shows a simple example of image rollover. Move your mouse to the following image and see it change.

Here's the html code:

<img id="x07896" src="i/tile_A.png" alt="tile A">

Following is the js code:

var xyz = document.getElementById("x07896");
xyz.onmouseover = function() { xyz.src="i/tile_B.png";};
xyz.onmouseout = function() { xyz.src="i/tile_A.png";};