<script language="JavaScript" type="text/JavaScript">
var intWidth=0;
function showhide(name)
{
obj=document.all.tags("td");

for(i=0;i<obj.length;i++)
{
if(obj[i].id==name)
{

if (obj[i].style.display =="none")
{
obj[i].style.display="";
intWidth+=parseInt(obj[i].width);
}
else
{
obj[i].style.display ="none";
intWidth-=parseInt(obj[i].width);
}
}


}
tbl1.width=intWidth;
alert(intWidth);
}
</script><div style="overflow-x:auto;width:300;" height="38"><table id="tbl1" height="38" border="1" cellpadding="0" cellspacing="0">
    <tr>
      <td id="21" style="display:none" width="100" bordercolor="#FF0000">1</td>
      <td id="22" style="display:none" width="100" bordercolor="#00FF00">2</td>
      <td id="23" style="display:none" width="100" bordercolor="#0000FF">3</td>
      <td id="24" style="display:none" width="100" bordercolor="#FFFF00">4</td>
      <td id="25" style="display:none" width="100" bordercolor="#FF00FF">5</td>
    </tr>
  </table>
  </div>
<form name="form2" method="post" action="">
  <p> 
    <input type="checkbox" name="checkbox" value="21" onClick="showhide(this.value);">
    1 
    <input type="checkbox" name="checkbox2" value="22" onClick="showhide(this.value);">
    2 
    <input type="checkbox" name="checkbox3" value="23" onClick="showhide(this.value);">
    3 
    <input type="checkbox" name="checkbox4" value="24" onClick="showhide(this.value);">
    4 
    <input type="checkbox" name="checkbox5" value="25" onClick="showhide(this.value);">
    5 </p>
  </form>