js怎么控制两个div层每隔10秒切换一次？
比如：<divid="ad"><divid="ad1"></div><divid="ad2"></div></div>怎么实现ad1和ad2每隔10秒切换一次？...
比如：
<div id="ad">
<div id="ad1">
</div>
<div id="ad2">
</div>
</div>
怎么实现ad1和ad2每隔10秒切换一次？ 展开
<div id="ad">
<div id="ad1">
</div>
<div id="ad2">
</div>
</div>
怎么实现ad1和ad2每隔10秒切换一次？ 展开
3个回答
展开全部
这个问题涉及到了两个知识点，一个知识点是利用js操作dom的css属性；另一个知识点是js进行定时操作。
有两种实现方式，一种是用原生js，另一种是用jquery。为了简单，以jquery为例：
<html>
<head>
<script src="./jquery.js"></script>
</head>
<body>
<div id="d1" style="display:none;">d1</div>
<div id="d2">d2</div>
<script>
$(function(){
//转换div
function changeDiv(){
if($("#d1").style.display==none){
$("#d1").show();
$("#d2").hide();
}else{
$("#d1").hide();
$("#d2").show();
}
}
//利用setInterval，设置每隔10秒执行changeDiv函数。
window.setInterval("changeDiv()",10000);
});
</script>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
两个层用隐藏和显示。用一个计时器，对两个层进行显示和隐藏，实现切换
追问
给个具体代码呗！非常感谢！
追答
var i=1;
var t;
function showPic()
{
document.getElementById("pic1").style.display="none";
document.getElementById("pic2").style.display="none";
for(i=1;i
没测试，放页面获取值，测试一下
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312" />
<title>1</title>
<script language="javascript">
function ss()
{
var div1=document.getElementById("ad1");
var div2=document.getElementById("ad2");
if(div1.style.display=='')
{
div2.style.display='';
div1.style.display='none'
}
else
{
div1.style.display='';
div2.style.display='none'
}
}
function hides(sdd)
{
var ds=document.getElementById(sdd);
ds.style.display='none';
}
function dd()
{
window.setInterval("ss()",2000);
}
</script>
</head>
<body onLoad="dd()" style=" text-align:center;">
<div id="ad" style="margin:0px auto; height:500px;line-height:500px;">
<div id="ad1" style=" width:300px; line-height:200px; height:200px; color:#F8B912; background-color:#46B9B4; border:2px #F8B912 solid;">
这是第一个div
</div>
<div id="ad2" style=" width:300px;line-height:200px; height:200px; color:#9ADE81; background-color:#C98DD8; border:2px #9ADE81 solid;">
这是第二个div
</div>
<script language="javascript">hides('ad2');</script>
</div>
</body>
</html>
这个是2秒切换一次的 10秒得话把2000改成10000就可以了。
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312" />
<title>1</title>
<script language="javascript">
function ss()
{
var div1=document.getElementById("ad1");
var div2=document.getElementById("ad2");
if(div1.style.display=='')
{
div2.style.display='';
div1.style.display='none'
}
else
{
div1.style.display='';
div2.style.display='none'
}
}
function hides(sdd)
{
var ds=document.getElementById(sdd);
ds.style.display='none';
}
function dd()
{
window.setInterval("ss()",2000);
}
</script>
</head>
<body onLoad="dd()" style=" text-align:center;">
<div id="ad" style="margin:0px auto; height:500px;line-height:500px;">
<div id="ad1" style=" width:300px; line-height:200px; height:200px; color:#F8B912; background-color:#46B9B4; border:2px #F8B912 solid;">
这是第一个div
</div>
<div id="ad2" style=" width:300px;line-height:200px; height:200px; color:#9ADE81; background-color:#C98DD8; border:2px #9ADE81 solid;">
这是第二个div
</div>
<script language="javascript">hides('ad2');</script>
</div>
</body>
</html>
这个是2秒切换一次的 10秒得话把2000改成10000就可以了。
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
