<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>图片轮播</title>
<style>
.show{
display: inline-block;
}
.hide{
display: none;
}
</style>
</head>
<body>
<div>
<img class="show" src="../images/01.jpg">
<img class="hide" src="../images/02.jpg">
<img class="hide" src="../images/03.jpg">
</div>
</body>
<script>
window.onload = function lunbo(){
var i = 0;
setInterval(function(){
var img = document.getElementsByTagName('img');
i++;
var num = i%img.length;
img[num].className = "show";
},2000)
}
</script>
</html>
问题：我用求余的方法去实现这个功能，num是一直在0，1，2之间循环，那么如何设置，在img[num]显示的时候，其余的两张
或者n张图片是隐藏的。谢谢大神
1 回答
已采纳
一席青衫粗布依丶
TA贡献5条经验 获得超3个赞
window.onload = function(){
var i=0,num=0;
var img = document.getElementsByTagName('img');
setInterval(function(){
num = i%img.length;
i==img.length? i = 0 : i++;
img[num].className = "show";
for(var j=0;j<img.length;j++){
if(j == num){
continue;
}else{
img[j].className = "hide";
}
}
},2000)
}
开始计时器时间有多余延时，还没有解决，图片切换没问题
添加回答
举报
0/150
提交
取消