<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Erit 图片轮换</title>
<script type="text/javascript">
window.onload = function (){
document.getElementById("compen1").src = "03.png";
transmigrate(0);
};
function getIndex(arr,id){
var j = 0;
for (var i = 0;i < arr.length;i++){
if (arr[i].id != id){
j++;
} else {
break;
}
}
return j;
}
function transmigrate(s){
var ImgArr = document.getElementsByName("compen");
var imgContent = document.getElementById("compen1");
var step = 2000;
var l = ImgArr.length;
var i = s;
var timer = null;
(function (){
if (i < l){
imgContent.src = ImgArr[i].src;
timer = setTimeout(arguments.callee,step);
i++;
} else {
transmigrate(0);
}
})();
var k = 0;
for (var j = 0;j < l;j++){
ImgArr[j].onmouseover = function (){
imgContent.src = this.src;
clearTimeout(timer);
}
ImgArr[j].onmouseout = function (){
k = getIndex(ImgArr,this.id);
transmigrate(k);
}
}
}
</script>
</head>
<body>
<table width="829" height="440" border="0" align="center">
<tr>
<td width="331" rowspan="4" align="center"><img id="compen1"/></td>
<td width="273" rowspan="4" valign="top"> </td>
<td width="211" height="113" align="center"><img id="compen2" name="compen" src="03.png" width="140" height="110" /></td>
</tr>
<tr>
<td height="110" align="center"><img id="compen3" name="compen" src="04.png" width="140" height="110" /></td>
</tr>
<tr>
<td align="center"><img src="05.png" id="compen4" name="compen" width="140" height="110" /></td>
</tr>
<tr>
<td align="center"><img id="compen5" src="06.png" name="compen" width="140" height="110" /></td>
</tr>
</table>
</body>
</html>