主页面的frame就不写了
直接写上下左右按钮的代码：
1.左边
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>cssrain</title>
<script language="javascript" type="text/javascript" >
function switchSysBar()
{
if (parent.document.getElementById('MainBody').cols=="210,10,*")
{
document.getElementById('leftbar').style.display="block";
document.getElementById('rightbar').style.display="none";
parent.document.getElementById('MainBody').cols="0,10,*";
}
else
{
parent.document.getElementById('MainBody').cols="210,10,*";
document.getElementById('leftbar').style.display="none"
document.getElementById('rightbar').style.display="block";
}
}
function load()
{
if (parent.document.getElementById('MainBody').cols=="0,10,*")
{
document.getElementById('leftbar').style.display="none";
}
}
</script>
</head>
<body onload="load()" style="margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:0px" >
<center>
<table cellspacing="0" cellpadding="0" border="0" style=" width:100%; height:100%"; >
<tbody>
<tr>
<td style="background-color: #009fef; width:1px ">
<img alt="" height="1" width="1" src="images/ccc.gif"/>
</td>
<td id="leftbar" style="display: none; background-color: #f5f4f4">
<a onclick="switchSysBar()" href="javascript:void(0);">
<img height="90" style=" border:0px; width:9px" alt="展开左侧菜单" src="images/pic24.gif"/>
</a>
</td>
<td id="rightbar" style="background-color: #f5f4f4">
<a onclick="switchSysBar()" href="javascript:void(0);">
<img height="90" style=" border:0px; width:9px;" alt="隐藏左侧菜单" src="images/pic23.gif"/>
</a>
</td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
2.顶部
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>cssrain</title>
<link href="../css/sytel.css" type="text/css" rel="stylesheet" />
<script language="javascript" type="text/javascript">
function switchSysBar()
{
if (parent.document.getElementById('MainFrame').rows=="53,10,*")
{
document.getElementById('leftbar').style.display="block";
document.getElementById('rightbar').style.display="none";
parent.document.getElementById('MainFrame').rows="0,10,*";
}
else
{
parent.document.getElementById('MainFrame').rows="53,10,*";
document.getElementById('leftbar').style.display="none"
document.getElementById('rightbar').style.display="block";
}
}
function load(){
if (parent.document.getElementById('MainFrame').rows=="53,10,*")
{
document.getElementById('leftbar').style.display="none";
}
}
</script>
</head>
<body onload="load()" style="margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:0px ; background-color: #f5f4f4;" >
<div class="t">
<table cellspacing="0" cellpadding="0" style="height: 10px; border:0px;padding-top:0px ;font-size:1pt " >
<tr style="padding-top:0px " >
<td id="leftbar" style="display: none; background-color: #f5f4f4;width:100%;text-align:center;height: 10px; ">
<a onclick="switchSysBar()" href="javascript:void(0);">
<img alt="展开顶部" src="images/pic27.gif" style="width: 120px; height: 9px;"/>
</a>
</td>
<td id="rightbar" style="height: 9px;background-color: #f5f4f4;width:100%;text-align:center; ">
<a onclick="switchSysBar()" href="javascript:void(0);">
<img alt="隐藏顶部" src="images/pic26.gif" style="width: 121px;height:9px;" />
</a>
</td>
</tr>
</table>
</div>
</body>
</html>
注意顶部的table 字体一定要设置成小点，否则在IE下无法贴到顶部。在FF 和谷歌浏览器下不存在这样的问题，不知道是否是BUG
不说了上图
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
