Image Rollover

This script adds a little bit of flashy, hi-tech to your webpage. When the user moves the mouse over your image the image changes, and then returns to normal when the mouse is moved off.

<html>
<head>
<title></title>
<script language="javascript">
<!-- This script works in: Navigator 3 - 4, Opera 3.1, and Explorer 4

if (document.images) {
teston = new Image(); // Active images
teston.src = "test.on.gif";

testoff = new Image(); // Inactive images
testoff.src = "test.off.gif";
}

function imgOn(imgName) {

if (document.images) {
document[imgName].src = eval(imgName + "on.src");
}
}

function imgOff(imgName) {
if (document.images) {
document[imgName].src = eval(imgName + "off.src");
}
}

// -->
</script>

</head>
<body>

<p><a href="testcss.html" onMouseOver="imgOn('test')" onMouseOut="imgOff('test')"><img src="test.off.gif" width="100" height="100" border="0" name="test"></a>

Notes:

  1. This script works in: Navigator 3 - 4, Opera 3.1, and Explorer 4
  2. To ensure the code is copied correctly, please click here.

See it in action.