您的位置:首页 > 其它

显示隐藏左侧菜单

2012-11-14 10:17 309 查看
  左侧有个菜单,右侧有个iFrame,然后可以隐藏与显示左侧的菜单。

1,下面是js代码:

<script type="text/javascript"  >

function HideShow(){
var alt=document.getElementById('switchPoint').alt;
var src=document.getElementById('switchPoint').src;
if(alt=='隐藏')
{
document.getElementById('switchPoint').setAttribute('alt','显示');//setAttribute
document.getElementById('switchPoint').setAttribute('src','show.jpg');
document.getElementById('leftFrame').style.display='none';//设置样式
//document.all("leftFrame").style.display='none';//如果是Frame用这个
}//if
else
{
document.getElementById('switchPoint').alt='隐藏';//直接给属性赋值
document.getElementById('switchPoint').src='hide.jpg';
document.getElementById('leftFrame').style.display='';
};//else
};//var HideShow

</script>


2,下面是html代码:

<body>

<table border="0" cellpadding="0" cellspacing="0" width="100%" style="height: 100%">
<tr>
<td bgcolor="#ff0000" width="8px">
 </td>
<td width="170px" valign="top" id="leftFrame">
<uc2:left ID="left1" runat="server" />
</td>
<td bgcolor="#00ff00" width="10px">
<img src="hide.jpg" alt="隐藏" id="switchPoint" onclick="HideShow()" style="cursor:hand"/>
</td>
<td align="left" valign="top" height="620px">
<iframe id="rightFrame" name="main" frameborder="0" scrolling="yes"  src="main.aspx" height="100%" width="100%" ></iframe>
 </td>
<td bgcolor="#0000ff" width="8px">
 </td>
</tr>
</table>

</body>


hide.jpg


show.jpg
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: