本帖最后由 猎鹰tianya 于 2014-2-10 16:26 编辑
{:soso_e118:}真奔溃,怎么弄列表都是叠在一起,怎么回事呢?把老师的视频倒回去看,看来看去没看出问题,求高手解释!!
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>Insert title here</title>
-
- <style type="text/css">
- dl dd{
- margin: 0px;
- }
-
- dl{
- height: 16px;
- }
-
- .open{
- overflow: visible;
- }
-
- .close{
- overflow: hidden;
- }
- </style>
-
- </head>
- <body>
-
- <script type="text/javascript">
- function list(node){
- var oDlNode =node.parentNode;
- if (oDlNode.className == "close") {
- oDlNode.className = "open";
- } else {
- oDlNode.className = "close";
- }
- }
- </script>
-
- <dl class="close">
- <dt onclick="list(this)">显示条目一</dt>
- <dd>展开列表内容1</dd>
- <dd>展开列表内容1</dd>
- <dd>展开列表内容1</dd>
- <dd>展开列表内容1</dd>
- </dl>
-
- <dl class="close">
- <dt onclick="list(this)">显示条目二</dt>
- <dd>展开列表内容2</dd>
- <dd>展开列表内容2</dd>
- <dd>展开列表内容2</dd>
- <dd>展开列表内容2</dd>
- </dl>
-
- <dl class="close">
- <dt onclick="list(this)">显示条目三</dt>
- <dd>展开列表内容3</dd>
- <dd>展开列表内容3</dd>
- <dd>展开列表内容3</dd>
- <dd>展开列表内容3</dd>
- </dl>
- </body>
- </html>
复制代码
|