黑马程序员技术交流社区
标题:
javascript展开闭合问题
[打印本页]
作者:
刘建宇
时间:
2012-1-13 23:50
标题:
javascript展开闭合问题
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
.open{ overflow:visible}
.close{ overflow:hidden}
dl{ overflow:hidden; height:16px}
</style>
<script type="text/javascript">
function setvisi()
{
var dtnode=event.srcElement;
var dlnode=dtnode.parentNode;
if(dlnode.className=="close")
{
dlnode.className="open";
}
else
{
dlnode.className="close";
}
}
</script>
</head>
<body>
<dl>
<dt onclick="setvisi()">上层目录</dt>
<dd>csafdcsasa</dd>
<dd>下层dasdas目录</dd>
<dd>下层asdasdsa目录</dd>
<dd>下层sa目录</dd>
</dl>
<dl>
<dt onclick="setvisi()">上层目录</dt>
<dd>下层xzdcas目录</dd>
<dd>下层目录</dd>
<dd>下层目录</dd>
<dd>下层目录</dd>
</dl>
</body>
</html>
为什么我写的这段html代码在实现展开闭合时，当展开第一个dl目录时会把下面的dl目录给覆盖掉？而不是随着dl的展开而把下一个dl封装的数据下移呢？
作者:
黄秋
时间:
2012-1-15 00:59
我的测试正常，你用什么浏览器？
作者:
张高振
时间:
2012-1-31 15:25
你用到的是css的overflow属性，这个属性定义溢出元素内容区的内容会如何处理。
visible 默认值。内容不会被修剪，会呈现在元素框之外。
hidden 内容会被修剪，并且其余内容是不可见的。
scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
inherit 规定应该从父元素继承 overflow 属性的值。
如果你想做展开闭合的效果，建议你用style.display属性来做
欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)
黑马程序员IT技术论坛 X3.2