图片的切换

来源：互联网发布：企业站源码编辑：程序博客网时间：2024/06/05 08:52

<html>
<head>
<style type="text/css">
.a{
position:absolute;
top:80px;
left:280px;
width:60%;
height:450px;
}
.a > img{
width:100%;
height:100%;

}
</style>
</head>

<body>
<div class="a" style="z-index:1;"><img src="bzaa.jpg" /></div>
<div class="a" style="z-index:2;"><img src="bzab.jpg" /></div>
<div class="a" style="z-index:3;"><img src="bzac.jpg" /></div>
<div class="a" style="z-index:4;"><img src="bzad.jpg" /></div>
<div class="a" style="z-index:5;"><img src="bzae.jpg" /></div>
<div class="a" style="z-index:6;"><img src="bzaf.jpg" /></div>
<script type="text/javascript">
function imgAutoChange(){
var imgCols = document.getElementsByClassName("a");
var imgColsLength = imgCols.length;
for(var i = 0; i < imgColsLength;i++){
var zIndex = parseInt(imgCols[i].style.zIndex,10);
zIndex = zIndex + 1;
if(zIndex > imgColsLength){
zIndex = 1;
}
imgCols[i].style.zIndex = zIndex;
}
}
window.setInterval(imgAutoChange,2000);

</script>
</body>
</html>

阅读全文

0 0