jsp页面如何实现左右分栏，同时分栏也可以自动隐藏

jsp页面如何实现左右分栏，就像CSDN样的，但分栏也可以在触发时能够隐藏，那位朋友知道吗？
最好能够有简单的代码实现效果，谢谢！

解决方案 »

  1.   

    去看Extjs.com 里面的layout 部分，效果很好
      

  2.   

    给楼主个思路吧
    1，一个总页面包含了3个iframe
    2，3个iframe是从左到右依次排布，分别是左侧树状，右侧列表区，中间的控制页代码如下参考：
    <body>
      <div onclick="changeWin();">
        <p><img src='' name="" id="" style="cursor:hand;" vertical-align="middle"></p><!--这个是中间的那个带有小三角的图片-->
      </div>
    </body>
    <script>
    function changeWin(){
      if( parent.frame.cols != "0,6,*"){
        document.all.ctrlimg.src="../images/showframe.gif";
        parent.frame.cols = "0,6,*";
      } else {
        document.all.ctrlimg.src="../images/closeframe.gif";
        parent.frame.cols = "210,6,*";
      }        
    }
    </script>
      

  3.   

    用frameset吧，注意页面不要有body标签
    <frameset id="top_frame" border="0" frameSpacing="0" cols="21%,3%,76%" frameBorder="no"> 
    <FRAME id="left_frame" name="left_frame" src="blank.htm" frameBorder="no" noResize scrolling="no"> 
    <FRAME id="ctr_frame" name="ctr_frame" src="bar.htm" frameBorder="no" noResize scrolling="no"> 
    <FRAME id="main_frame" name="main_frame" src="blank.htm" frameBorder="no" noResize scrolling="no"> 
    </frameset> bar.htm的代码里要控制top_frame.cols  如隐藏做侧菜单栏可设为top_frame.cols=“0%,3%,*”  显示则top_frame.cols=“21%,3%,* 
      

  4.   


    <html>
    <head>
        <title>分栏</title>
        <meta name="designer" content="csdn design team - meizz" />
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    </head>
    <frameset id="sidebar_content" cols="230, *" frameborder="1" border="6" framespacing="5"
        bordercolor="#A1C7F9">
        <frame name="sidebarFrame" src="/WebConsole/sidebar.aspx" scrolling="no" frameborder="1" />
        <frame name="ContentFrame" src="/Default.aspx" frameborder="0" />
    </frameset>
    </html>要使用隐藏的话，就加个事件操作吧
      

  5.   

    呵呵，我昨天晚上也在做这个东西，忙活了1晚上才做好啊，没用过JSP，做起来头大