[js]可折叠的框架效果

今天学习过程中遇到要实现一个仿QQ下拉菜单的效果,在网上找到一些资料,资料目前以保存在blog文件中,以下是左右伸缩的代码.

将以下代码保存为htm或html文件在浏览器里一看便知效果.

<SCRIPT language=javascript>
function switchbar(){
if (switchPoint.innerText==3){
switchPoint.innerText=4
document.all("frm").style.display="none"
}else{
switchPoint.innerText=3
document.all("frm").style.display=""
}}
</SCRIPT>
<TABLE height="100%" cellSpacing=0 cellPadding=0 width="100%" border=0>
  <TR>
    <TD id=frm vAlign=center noWrap align=middle><IFRAME
      style="Z-INDEX: 2; VISIBILITY: inherit; WIDTH: 150px; HEIGHT: 100%"
      name=rijcm src="left.asp"
      frameBorder=0>rijcm</IFRAME></TD>
    <TD width=10 bgColor=#4397c5>
      <TABLE height="100%" cellSpacing=0 cellPadding=0 border=0>
        <TBODY>
        <TR>
          <TD style="HEIGHT: 100%" οnclick=switchbar()><FONT
            style="FONT-SIZE: 9pt; CURSOR: hand; COLOR: white; FONT-FAMILY: Webdings"><SPAN
            id=switchPoint>3</SPAN> </FONT></TR></TBODY></TABLE></TD>
    <TD width="100%">
      <IFRAME id=main style="Z-INDEX: 1; VISIBILITY: inherit; WIDTH: 100%; HEIGHT: 100%"
      name=main src="bigsmall.asp" frameBorder=0 scrolling=yes>rijcm</IFRAME>
    </TD>
  </TR></TABLE>
</html>