用js怎样实现frameset的resize功能

<td>....</td>
<td><img /></td>
<td>....</td>想用鼠标拖动中间的<td>动态改变左右两个<td>的大小
就是类似frameset的resize功能
求思路

解决方案 »

  1.   

    具体代码没有
    思路应该清晰
    鼠标到中间就 cursor显示为拖动
    然后记录鼠标位置
    td1.width += delta
    td2.width -= delta
      

  2.   

    问题是重新设置width的那个方法应该是在哪里触发
    我设置了中间<td>的onmouseup 和<body> 的onmouseup 事件都没起作用
      

  3.   

    FrameSet的文件：注意那个Border，<FRAME src="Border.htm" scrolling="no"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
    <html>
    <head>
    <TITLE>文件管理系统</TITLE>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312">
    <meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
    <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
    </head>
    <frameset rows="95,75%,25" border="0" frameSpacing="0" frameBorder="0" onresize="">
    <frame name="banner" src="MainTop.aspx" scrolling="no" noresize>
    <frameset name="AllParent" cols="161,1%,78%" onresize>
    <frame name="MenuTree" src="MenuTree.aspx" scrolling="no" id="MenuTree">
    <FRAME src="Border.htm" scrolling="no">
    <frame name="main" src="Welcome.aspx" id="WelCome">
    </frameset>
    <FRAME id="Bottom" src="MainBottom.htm" scrolling="no">
    <noframes>
    <pre id="p2">
    ================================================================
    关于完成此标题和内容框架集的说明
    1. 为“banner”框架添加 src="" 页的 URL。
    2. 为“contents”框架添加 src="" 页的 URL。
    3. 为“main”框架添加 src="" 页的 URL。
    4. 将 BASE target="main" 元素添加到“contents”页的 
    HEAD，以将“main”设置为默认框架，“contents”页的链接将
    在该框架中显示其他页。
    ================================================================
    </pre>
    <p id="p1">
    此 HTML 框架集显示多个 Web 页。若要查看此框架集，请使用支持 HTML 4.0 及更高版本的 Web 浏览器。
    </p>
    </noframes>
    </frameset>
    </html>这是那个Border.htm文件：
    <html>
    <head>
    <title>Border</title>
    <meta content="JavaScript" name="vs_defaultClientScript">
    <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
    <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
    <meta content="VisualStudio.HTML" name="ProgId">
    <meta content="Microsoft Visual Studio .NET 7.1" name="Originator">
    <script language="javascript">
      var Flag = false;
      function HideMenu()
      {
        if (Flag == false)
    {
    parent.AllParent.cols="0,1%,99%";

    document.MyImg.src="images/BaseImages/arrow_r.gif";
    Flag = true;
    }
    else
    {
    parent.AllParent.cols="160,1%,99%";
    document.MyImg.src="images/BaseImages/arrow_l.gif";
    Flag = false;
    }     
      }
    </script>
    </head>
    <BODY bgColor="#dbe7f6" leftMargin="0" topMargin="0" border="0">
    <TABLE id="Table1" style="CURSOR: hand" height="400" cellSpacing="0" cellPadding="0" width="8"
    border="0">
    <TBODY>
    <TR>
    <TD>
    <TABLE cellspacing="0" width="98%" height="50" bgcolor="#EEEEEE" border="1" bordercolorlight="#000000"
    bordercolordark="#FFFFFF" cellpadding="0" ID="Table2">
    <TD title="全屏/半屏" onclick="HideMenu()"><IMG id="MyImg" height="7" src="Images/BaseImages/arrow_l.gif" width="8" align="middle"
    name="MyImg">
    </TABLE>
    </TD>
    </TR>
    </TBODY>
    </TABLE>
    </BODY>
    </html>
      

  4.   

    <td id='left'></td>
    <td onMouseOver="this.style.cursor='e-resize'"
         ondrag='document.all.left.width=event.clientX'>
         <img />
    </td>
    <td></td>