欢迎光临

木子屋

标题: 显示/隐藏菜单

作者: dnawo

日期: 2007-04-09 02:25 PM

分类: 脚本语言

内容: 在开发一些应用程序时常会使用下图所示的布局，通过控制菜单的显示/隐藏，让整个操作界面看起来非常舒适，易用，下边我们就来说说实现过程。
实现原理：主要利用了框架技术。将主界面分成左中右三部分，左部分置放菜单页面，中间用于置放控制按钮，右边用于置放内容页面。
主要代码：
1.主界面代码
复制内容到剪贴板 程序代码<frameset cols="150,20,*" id="frameset1">
<frame src="menu.htm" name="leftFrame" id="leftFrame" />
<frame src="control.htm" name="controlFrame" id="controlFrame" />
<frame src="main.htm" name="mainFrame" id="mainFrame" />
</frameset>
2.控制页代码
复制内容到剪贴板 程序代码<script language="javascript">
var isClose=0;
function ControlMenu(){
if(isClose==0){
parent.frameset1.cols="0,20,*";
isClose = 1;
}else{
parent.frameset1.cols="150,20,*";
isClose = 0;
}
}
</script>
<table width="20" height="100%" border="0" cellpadding="0" cellspacing="0" onClick="ControlMenu()">
<tr>
<td bgcolor="#009999">&nbsp;</td>
</tr>
</table>

+ 查看当前日志评论 (0)

登录

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.609 ms

返回

标题: 显示/隐藏菜单

你没有权限发表评论

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.609 ms

返回

暂无评论

返回

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.641 ms

返回