csdn社区这种frame的显示和隐藏如何实现的，有类似的代码吗？

<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<SCRIPT language=javascript>
function hide()
{
B1.style.display = "none";
B2.style.display = "";
window.top.main.cols = "0,8,*";
}
function show()
{
B1.style.display = "";
B2.style.display = "none";
window.top.main.cols = "180,8,*";
}
</SCRIPT>
</HEAD>
<BODY style="OVERFLOW: hidden" bgColor=#6699cc leftMargin=0 topMargin=0 marginheight="0">
<TABLE height="100%" cellSpacing=0 cellPadding=0 align=center border=0>
<TBODY>
<TR>
<TD align=middle><INPUT id=B1 onmouseover="this.src='images/btnrighthover.jpg'" style="CURSOR: default" onclick=javascript:hide(); onmouseout="this.src='images/btnright.jpg'" type=image height=50 alt=隐藏左框架 width=8 src="images/btnright.jpg" border=0> <INPUT id=B2 onmouseover="this.src='images/btnlefthover.jpg'" style="DISPLAY: none; CURSOR: default" onclick=javascript:show(); onmouseout="this.src='images/btnleft.jpg'" type=image height=50 alt=显示左框架 width=8 src="images/btnleft.jpg" border=0> </TD></TR></TBODY></TABLE></BODY></HTML>