Lightninghawk 40 Posting Whiz in Training

Below is a code I have been using on Google Earth to have the ability to use optionally expanded tables within the balloon that is open for each placemark.

I want to know if there is a way I can alter the code so that when
I expand the table it also expands the div settings for the size of the balloon itself.

current div setting

<div style="height:175px; width:650px; overflow:scroll; overflow-x:hidden;">

desired div setting when table is expanded

<div style="height:650px; width:650px; overflow:scroll; overflow-x:hidden;">

Javascript

<script type="text/javascript">

function toggle_visibility(tbid,lnkid) {
if (document.getElementsByTagName) {
  var tables = document.getElementsByTagName('table');
  for (var i = 0; i < tables.length; i++) {
   if (tables[i].id == tbid){
     var trs = tables[i].getElementsByTagName('tr');
     for (var j = 2; j < trs.length; j+=1) {
     trs[j].bgcolor = '#CCCCCC';
       if(trs[j].style.display == 'none')
          trs[j].style.display = '';
       else
          trs[j].style.display = 'none';
    }
   }
  }
 }
   
}
</script>

one table header with show/hide feature

<table width="600" border="0" align="center" cellpadding="4" cellspacing="0" id="tbl1" name="tbl1">
        <tr><td height="1" bgcolor="#727272" colspan="3"></td></tr>
        <tr bgcolor="#dddddd"><td height="15" colspan="2"> <strong>SURVEY ORDER INFORMATION</strong></td>
            <td bgcolor="#dddddd"><a href="javascript:toggle_visibility('tbl1','lnk1');">
            <div align="right" id="lnk1" name="lnk1">Show / Hide</div></a></td></tr>