DIV层显示隐藏
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了DIV层显示隐藏相关的知识，希望对你有一定的参考价值。
在页面里放了 8个DIV层 第一个打开网页就显示了，其他隐藏了用的是 display=“none”；
有弄了两个按钮 ，一个是点击的功能是 将第一个隐藏，显示第二个，再那该按钮隐藏第二个
显示第三个，以此类推。
第二个按钮就是返回，比如：到最后一个DIV层 返回，就显示第7 个隐藏第8 个DIV
大至就是这个点击事件 如何实现啊 ？
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
#cc
height:200px;
width:300px;
overflow:hidden;
#cc div
font-size:72px;
text-align:center;
line-height:200px;
width:300px;
height:200px;
background-color:#FFC;
</style>
</head>
<body>
<div id="cc">
<div>1</div>
<div style="display:none">2</div>
<div style="display:none">3</div>
<div style="display:none">4</div>
<div style="display:none">5</div>
<div style="display:none">6</div>
<div style="display:none">7</div>
<div style="display:none">8</div>
</div>
<script language="javascript" type="text/javascript" >
var N=0;
function nextDIV()
document.getElementById("cc").getElementsByTagName("div").item(N).style.display="none";
if(N==7) N=0;
else N++;
document.getElementById("cc").getElementsByTagName("div").item(N).style.display="block";
function previousDIV()
document.getElementById("cc").getElementsByTagName("div").item(N).style.display="none";
if(N==0) N=7;
else N--;
document.getElementById("cc").getElementsByTagName("div").item(N).style.display="block";
</script>
<input type="button" onclick="nextDIV()" value="next" />
<input type="button" onclick="previousDIV()" value="previous" />
</body> 参考技术B 还要设置Z-index属性！！！追问
什么意思，怎么做？
以上是关于DIV层显示隐藏的主要内容，如果未能解决你的问题，请参考以下文章