Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<title>TITLE</title>
<script type="text/javascript">
//preload images
var imgs = ["http://www.codingforums.com/img/cfnewyear.jpg", "http://www.codingforums.com/images/buttons/post_thanks.gif", "http://www.codingforums.com/images/buttons/reply.gif"];
var loadedImgs = []
for (var i=0; i<imgs.length; i++)
{
loadedImgs[i] = new Image();
loadedImgs[i].src = imgs[i];
}
</script>
</head>
<body>
<img src="http://www.codingforums.com/img/cfnewyear.jpg" id="slide" style="border:0;cursor:pointer" />
<script type="text/javascript">
var slideImg = document.getElementById('slide');
var step = 0;
var whichimage = 0;
var timer;
function slideit()
{
if (!document.images) return;
slideImg.src = loadedImgs[step].src;
whichimage = step;
step = (step < 2) ? step + 1 : 0;
timer = setTimeout("slideit()", 1800);
}
function slidelink()
{
window.location.href = "link" + whichimage + ".html";
}
window.onload = function()
{
slideImg.onclick = slidelink;
slideImg.onmouseover = function(timeElapsed)
{
clearTimeout(timer);
};
slideImg.onmouseout = function(timeElapsed)
{
timer = setTimeout("slideit()", 900);
};
slideit();
};
</script>
</body>
</html>