隐藏和显示倒还好办,伸缩可就复杂了.

解决方案 »

  1.   

    <html>
     <head>
      <SCRIPT language=javascript>
       function drawTable(oprName,tableID,objID,cstHt){
    var elm = document.getElementById(tableID);
    if (oprName=="show") {
    elm.style.display="";
    }else if(oprName=="hide"){
    elm.style.display="none";
    }else if(oprName=="fit"){
    elm.height=document.getElementById(objID).clientHeight;
    }else if(oprName=="restore"){
    elm.height=cstHt;
    }
       }
      </SCRIPT>
      </head>
     <body>
     <button onclick="drawTable('show','t')">show</button> &nbsp; 
     <button onclick="drawTable('hide','t')">hide</button> &nbsp; 
     <button onclick="drawTable('fit','t','tt')">f i t</button> &nbsp; 
     <button onclick="drawTable('restore','t','','300')">restore</button>
      <table id=t align=left>
      <tr height="33%"><td>abc</td><td>abc</td><td>abc</td></tr>
      <tr height="33%"><td>abc</td><td>abc</td><td>abc</td></tr>
      <tr height="33%"><td>abc</td><td>abc</td><td>abc</td></tr>
     </table> <TABLE id=tt bgcolor=yellow height="200" width="100" align=center>
     <TR>
      <TD>&nbsp;</TD>
     </TR>
     </TABLE>
     </body>
    </html>