FF（firefox）/chrom/ie稳定暂无bug...
注意：请自己建立一个images文件，放入几张900*238的图片（注意图片格式和名字与程序中一致）。
1. [图片] 1.JPG
2. [图片] 2.JPG
3. [文件] style.css ~ 443B
#contain{
float:left;
900px;
height: 240px;
border: 1px dotted red;
}
.imageShow{
900px;
height: 238px;
border: 1px dashed Olive;
background: url(images/0.png);
}
#posi{
margin: -30px 0 0 700px;
100px;
height: 25px;
}
.radio{
15px;
height: 15px;
margin-left: -8px;
cursor: pointer;
background: red;
}
4. [文件] autoChangeImages.js ~
var i = 1;
function autoChangeImage(i){ //自动改变图片
setTimeout("changeImage(i++); ", 1500);
setTimeout("back(i); ", 1000);
setTimeout("autoChangeImage(i = (i%5)); ", 1500);
}
function changeImage(idNum){
document.getElementById("radio" + idNum).checked = "checked";
switch(idNum){
case 0:
document.getElementById("imgIndex").style.backgroundImage = "url(images/0.png)";//改变首页图片
break;
case 1:
document.getElementById("imgIndex").style.backgroundImage = "url(images/1.png)";
break;
case 2:
document.getElementById("imgIndex").style.backgroundImage = "url(images/2.png)";
break;
case 3:
document.getElementById("imgIndex").style.backgroundImage = "url(images/3.png)";
break;
case 4:
document.getElementById("imgIndex").style.backgroundImage = "url(images/4.png)";
break;
}
}
5. [文件] autoChangeImages.html
<!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>http://www.huiyi8.com/hunsha/hanshi/
<title>autoChangeImages</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type = "text/javascript" language = "javascript" src = "autoChangeImages.js"></script>
<link rel = "stylesheet" type = "text/css" href = "style.css" />
</head>
<body onLoad = "autoChangeImage();">
<div id = "contain"> <!--图片展示内容框-->
<div id = "imgIndex" class = "imageShow"> <!--默认显示图片框-->
</div>
<div id = "posi"><!--按钮位置-->
<input id = "radio0" class = "radio" name = "lit" type = "radio"
value = "0" onClick="changeImage(0)" />
<input id = "radio1" class = "radio" name = "lit" type = "radio"
value = "0" onClick="changeImage(1)" />
<input id = "radio2" class = "radio" name = "lit" type = "radio"
value = "0" onClick="changeImage(2)" />
<input id = "radio3" class = "radio" name = "lit" type = "radio"
value = "0" onClick="changeImage(3)" />
<input id = "radio4" class = "radio" name = "lit" type = "radio"
value = "0" onClick="changeImage(4)" />
</div>
</div>
</body>
</html>