js定时控制多个div自动切换 5个div,只显示一个,其余4个隐藏,用js控制每10秒自动切换一个,求完整代码
1个回答
展开全部
手痒痒的,顺便把代码写出来了,不知道是不是你想要的。。。。如下:
<html>
<head>
<title>测试</title>
<script type="text/javascript">
var NowImg=1;//表示当前显示的div
var MaxImg=5;//表示div的个数
function show(){
for(var i=1;i<=MaxImg;i++){
if(NowImg==i)
document.getElementById("div"+NowImg).style.display='block';//当前显示的div
else
document.getElementById("div"+i).style.display='none';
}
if(NowImg==MaxImg)//判断当前div是否是最后一个,如果是则从第一个重新轮回显示
NowImg=1;
else
NowImg++;//设置下一个显示的图片
}
theTimer=setInterval("show()",10000);//设置定时器,显示下一个图片,10000表示每间隔10秒,可以改的。。。
</script>
</head>
<body onload="show()">
<div>
<div id="div1" style="display:block;"><img src="图片" /></div>
<div id="div2" style="display:none;"><img src="图片" /></div>
<div id="div3" style="display:none;"><img src="图片" /></div>
<div id="div4" style="display:none;"><img src="图片" /></div>
<div id="div5" style="display:none;"><img src="图片" /></div>
</div>
<body>
</html>
手写,请采纳!!!
<html>
<head>
<title>测试</title>
<script type="text/javascript">
var NowImg=1;//表示当前显示的div
var MaxImg=5;//表示div的个数
function show(){
for(var i=1;i<=MaxImg;i++){
if(NowImg==i)
document.getElementById("div"+NowImg).style.display='block';//当前显示的div
else
document.getElementById("div"+i).style.display='none';
}
if(NowImg==MaxImg)//判断当前div是否是最后一个,如果是则从第一个重新轮回显示
NowImg=1;
else
NowImg++;//设置下一个显示的图片
}
theTimer=setInterval("show()",10000);//设置定时器,显示下一个图片,10000表示每间隔10秒,可以改的。。。
</script>
</head>
<body onload="show()">
<div>
<div id="div1" style="display:block;"><img src="图片" /></div>
<div id="div2" style="display:none;"><img src="图片" /></div>
<div id="div3" style="display:none;"><img src="图片" /></div>
<div id="div4" style="display:none;"><img src="图片" /></div>
<div id="div5" style="display:none;"><img src="图片" /></div>
</div>
<body>
</html>
手写,请采纳!!!
追问
试了一下,直接转到最后一个层了,没有做切换,不知道哪里的问题
追答
没有问题的呀,我刚才也做了测试,放不同的图片试试,你看看是不是图片的路径设置有问题
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询