网页设计可折叠面板

1、请教DW 中的可折叠式面板问题

这个问题，如果我没理解错的话，应该要用到setTimeOut这个函数了。
不过，具体要怎么改，大概还不大好说清楚，因为，你的描述，我还是没看太懂呀，你可以通过追问的方式，再把问题细说一下。

2、网页折叠面板代码

<script language=javascript>
function f()
{
if(div1.style.display=="")
{
div1.style.display="none";
}
else
{
div1.style.display="";
}
}
</script>
<input type=button value=click onclick=f()>
<div id=div1>
这里的文字将折叠
</div>

重点：
1、div1.style.display="" //让层显示
2、div1.style.display="none" //让层隐藏
3、记专得给我分属！呵呵。

3、请教一个网页制作问题：怎样制作折叠页面

首先，你要利用布局表格和布局单元格制作一个样式，然后每做一个付页都以这个样式为基础就行了。比如左侧和上部为台头和导航，中间部分为展示区域，然后每个付页都做成这样，就可以了。

4、网页树形折叠菜单制作

JavaScript Code： function Ob(o){ var o=document.getElementById(o)?document.getElementById(o):o; return o; } function Hd(o) { Ob(o).style.display="none"; } function Sw(o) { Ob(o).style.display=""; } function ExCls(o,a,b,n){ var o=Ob(o); for(i=0;i<n;i++) {o=o.parentNode;} o.className=o.className==a?b:a; } function CNLTreeMenu(id,TagName0) { this.id=id; this.TagName0=TagName0==""?"li":TagName0; this.AllNodes = Ob(this.id).getElementsByTagName(TagName0); this.InitCss = function (ClassName0,ClassName1,ClassName2,ImgUrl) { this.ClassName0=ClassName0; this.ClassName1=ClassName1; this.ClassName2=ClassName2; this.ImgUrl=ImgUrl || "css/s.gif"; this.ImgBlankA ="<img src=\"css/s.gif\" class=\"s\" onclick=\"ExCls(this,'"+ClassName0+"','"+ClassName1+"',1);\" alt=\"展开/折叠\" />"; this.ImgBlankB ="<img src=\"css/s.gif\" class=\"s\" />"; for (i=0;i<this.AllNodes.length;i++ ) { this.AllNodes[i].className==""?this.AllNodes[i].className=ClassName1:""; this.AllNodes[i].innerHTML=(this.AllNodes[i].className==ClassName2?this.ImgBlankB:this.ImgBlankA)+this.AllNodes[i].innerHTML; } } this.SetNodes = function (n) { var sClsName=n==0?this.ClassName0:this.ClassName1; for (i=0;i<this.AllNodes.length;i++ ) { this.AllNodes[i].className==this.ClassName2?"":this.AllNodes[i].className=sClsName; } } } CSS Code： .CNLTreeMenu img.s {cursor:pointer;vertical-align:middle;} .CNLTreeMenu ul {padding:0;} .CNLTreeMenu li {list-style:none;padding:0;} .Closed ul {display:none;} .Child img.s {background:none;cursor:default;} #CNLTreeMenu1 ul {margin:0 0 0 17px;} #CNLTreeMenu1 img.s {width:20px;height:15px;} #CNLTreeMenu1 .Opened img.s {background:url(skin1/opened.gif) no-repeat 0 0;} #CNLTreeMenu1 .Closed img.s {background:url(skin1/closed.gif) no-repeat 0 0;} #CNLTreeMenu1 .Child img.s {background:url(skin1/child.gif) no-repeat 3px 5px;} #CNLTreeMenu2 ul {margin:0 0 0 17px;} #CNLTreeMenu2 img.s {width:17px;height:15px;} #CNLTreeMenu2 .Opened img.s {background:url(skin2/opened.gif) no-repeat 4px 6px;} #CNLTreeMenu2 .Closed img.s {background:url(skin2/closed.gif) no-repeat 3px 6px;} #CNLTreeMenu2 .Child img.s {background:url(skin2/child.gif) no-repeat 3px 5px;} #CNLTreeMenu3 ul {margin:0 0 0 17px;} #CNLTreeMenu3 img.s {width:34px;height:18px;} #CNLTreeMenu3 .Opened img.s {background:url(skin3/opened.gif) no-repeat 0 1px;} #CNLTreeMenu3 .Closed img.s {background:url(skin3/closed.gif) no-repeat 0 1px;} #CNLTreeMenu3 .Child img.s {background:url(skin3/child.gif) no-repeat 13px 2px;} html code: <p> <!--CNLTreeMenu Start:--> </p> <div class="CNLTreeMenu" id="CNLTreeMenu1"> <h4>CNL Tree Menu1</h4> <p><a id="AllOpen_1" href="#" onclick="MyCNLTreeMenu1.SetNodes(0);Hd(this);Sw('AllClose_1');">全部展开</a><a id="AllClose_1" href="#" onclick="MyCNLTreeMenu1.SetNodes(1);Hd(this);Sw('AllOpen_1');" style="display:none;">全部折叠</a></p> <ul> <li class="Opened"><a href=" http://www.iecn.net ">IECN.Net</a> <ul> <li><a href="#1">技术区</a> <ul> <li><a href="#">网页技术</a> <ul> <li class="Child"><a href="#">JavaScript</a></li><!--Child Node--> <li class="Child"><a href="#">HTML/XHTML/CSS</a></li> <li class="Child"><a href="#">Ajax</a></li> <li class="Child"><a href="#">网页制作工具</a></li> <li class="Child"><a href="#">设计/图形</a></li> <li class="Child"><a href="#">Flash/多媒体</a></li> <li class="Child"><a href="#">VML/Web3D</a></li> </ul></li><!--Sub Node 3--> <li><a href="#">Web编程</a> <ul> <li class="Child"><a href="#">Java</a></li><!--Child Node--> <li class="Child"><a href="#">.Net</a></li> <li class="Child"><a href="#">ASP/VBScript</a></li> <li class="Child"><a href="#">PHP</a></li> <li class="Child"><a href="#">Perl/Python</a></li> <li class="Child"><a href="#">Web综合/开源</a></li> </ul></li><!--Sub Node 3--> <li><a href="#">数据库</a> <ul> <li class="Child"><a href="#">Access/SQLServer</a></li><!--Child Node--> <li class="Child"><a href="#">MySQL/PostgreSQL</a></li> <li class="Child"><a href="#">Oracle/DB2/Sybase</a></li> </ul></li><!--Sub Node 3--> <li><a href="#">服务器</a> <ul> <li class="Child"><a href="#">Windows/IIS</a></li><!--Child Node--> <li class="Child"><a href="#">Unix/Linux/Apache</a></li> <li class="Child"><a href="#">应用服务器</a></li> </ul></li><!--Sub Node 3--> </ul></li><!--Sub Node 2--> <li><a href="#1">二级目录</a> <ul> <li><a href="#">三级目录</a> <ul> <li><a href="#">四级目录</a> <ul> <li><a href="#">五级目录</a> <ul> <li><a href="#">......</a> <ul> <li><a href="#">第n级目录</a> <ul> <li class="Child"><a href="#">叶结点1</a></li><!--Child Node--> <li class="Child"><a href="#">叶结点2</a></li> <li class="Child"><a href="#">叶结点3</a></li> </ul></li><!--Sub Node n --> </ul></li><!--Sub Node 6 --> </ul></li><!--Sub Node 5 --> </ul></li><!--Sub Node 4--> </ul></li><!--Sub Node 3--> </ul></li><!--Sub Node 2--> <li><a href="#1">二级目录</a> <ul> <li><a href="#">三级目录</a> <ul> <li><a href="#">四级目录</a> <ul> <li><a href="#">五级目录</a> <ul> <li><a href="#">......</a> <ul> <li><a href="#">第n级目录</a> <ul> <li class="Child"><a href="#">叶结点1</a></li><!--Child Node--> <li class="Child"><a href="#">叶结点2</a></li> <li class="Child"><a href="#">叶结点3</a></li> </ul></li><!--Sub Node n --> </ul></li><!--Sub Node 6 --> </ul></li><!--Sub Node 5 --> </ul></li><!--Sub Node 4--> </ul></li><!--Sub Node 3--> </ul></li><!--Sub Node 2--> </ul></li><!--Sub Node 1 --> </ul> </div><!-- CNLTreeMenu --> <!--CNLTreeMenu1 End!-->

希望采纳

5、网页设计怎么将一部分内容折叠起来

折叠一般用hide()

引用jQuery

然后用 $("#div1").hide() 就能把id为div1的区域隐藏起来了。保留title的显示，就能做到你说的折叠

6、html折叠面板代码无法实现效果

确认一下
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css">
这几抄个文件有没袭有引入进来，有可能是你的网慢，没有引入

7、dreamweaver网页设计中使用spry可折叠面板时，怎样设计面板的更漂亮

样式只能做出样子出来，真正把功能实现你还需要运用到JS

8、dreamweaver里面的可折叠面板，可以可以自己设置样式？就是自己设置背景啥的

你把这个设置在css样式表里面

9、网页折叠菜单

<!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=utf-8" />
<title>每次只展开一组的折叠菜单</title>
<style type="text/css">
*{ margin:0px; padding:0px; border:0px; }
body{ font-size:12px; color:#333;text-align:center;}
.ztbox{ background:#fff;}
.ztbox{text-align:left;width:220px;height:auto;border:solid 1px #2173f7;margin:10px auto 0px;overflow: hidden;position: absolute;left: 10px;top: 0px; }
.ztbox h2{font-size:14px;height:22px;line-height:22px;background:#c6d5ff;text-indent:10px;position:relative;border-top: 1px solid #fff;border-bottom: 1px solid #2173f7; font-weight:normal;cursor:pointer;}
.ztbox h2 span{font-weight: normal;position:absolute;top:0;right:6px;}
.ztbox li{border-bottom:dashed 1px #eee;}
.ztbox {border-bottom:solid 1px #2173f7;}
.ztlist{ list-style:disc url(none); margin:6px 10px 6px 20px;}
</style>
</head>
<body>
<div id="ztbox" class="ztbox" style="left: 10px; width: 149px;">
<h2 id="t1" onclick="ShHi('t1','h1');">
标题1
</h2>
<ul class="ztlist" id="h1" style="display:none;">
<li>
这里可以放很多的内容...
</li>
</ul>
<h2 id="t2" onclick="ShHi('t2','h2');">
标题2
</h2>
<ul class="ztlist" id="h2" style="display:none;">
<li>
这里可以放很多的内容...
</li>
</ul>
</div>
<script type="text/javascript">
var clickul,clickh;
function $(d){return document.getElementById(d);}//这里声明一个$函数简化了代替了getElementById，以后$('aa')就相当于docudocument.getElementById('aa');
function f(d){//这个方法用来获得DHTMLElement的style属性（style属性和CSS的是对应的）如果没有这样ID的DHTMLElement则返回空值
var t=$(d);if (t){return t.style;
}else{
return null;
}
}
function Hi(){//隐藏
if(clickul)clickul.style.display='none';
}
function Hl(){//把层的字体变回正常
if(clickh)clickh.style.fontWeight='normal';
}
function h(d){//判断这个DHTMLElement是不是隐藏的
var s=f(d);
var b=s.display;
if (b=='none'){
return true;
}else{
return false;
}
}
function ShHi(ii,jj){
if(h(jj)){//判断是不是隐藏
Hi();
Hl();
f(jj).display='block';//把jj(传入来的参数)为ID的层显示出来
f(ii).fontWeight='bold';//字体变为‘BOLD’
clickul=$(jj);clickh=$(ii);
}else{//如果JJ不隐藏，执行下面的
Hi();
Hl();
f(jj).display='none';//隐藏
f(ii).fontWeight='normal';//字体变回正常
clickul=null;clickh=null;
}
}</script></body></html>
不明白“和添加菜单的下滑时间功能”是什么功能
所以没有写
任何疑问：
blog.csdn.net/shmilyhe
或
[email protected]

10、设计一个网页折叠菜单，如何设置它默认为关闭状态？

在你想隐藏的折叠菜单外层的盒子加上这个CSS属性：display：none；就好了