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秒切换一次? 展开
展开全部
这个问题涉及到了两个知识点,一个知识点是利用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就可以了。
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询