表格列宽拖动问题~~~

本人在网上看到了很多能够实现鼠标拖动改变表格列宽功能的js代码，但是在调整了合适的列宽后，刷新页面表格列宽又恢复到以前未拖动调整的状态！希望大家帮忙呀！看看如何实现刷新页面仍保持表格宽度拖动调整后的效果。代码如下：
<style>
span {position:relative;z-index:1;background:red;width:2px;height:18px;left:expression(this.parentElement.offsetWidth-2);cursor:e-resize;}
</style>
<script language="javascript">function DownTo(obj){
obj.mouseDownX=event.clientX;
obj.pareneTdW=obj.parentElement.offsetWidth;
obj.pareneTableW=theObjTable.offsetWidth;
obj.setCapture();
}
function MoveTo(obj){
if(!obj.mouseDownX){return false;}
var newWidth=obj.pareneTdW*1+event.clientX*1-obj.mouseDownX;
if(newWidth>0){
obj.parentElement.style.width = newWidth;
theObjTable.style.width=obj.pareneTableW*1+event.clientX*1-obj.mouseDownX;
}
}
function UpTo(obj){obj.releaseCapture();obj.mouseDownX=0;}
</script>
<table id="theObjTable" border="1" cellspacing="0" cellpadding="0" style="border-collapse:collapse;width:80%;table-layout:fixed;">
     <tr bgcolor="cccccc">
         <td><span onmousedown="DownTo(this)" onmousemove="MoveTo(this)" onmouseup="UpTo(this)"></span>aaa</td>
         <td><span onmousedown="DownTo(this)" onmousemove="MoveTo(this)" onmouseup="UpTo(this)"></span>bbb</td>
         <td><span onmousedown="DownTo(this)" onmousemove="MoveTo(this)" onmouseup="UpTo(this)"></span>ccc</td>
     </tr>
     <tr>
         <td>aaaa fdsa fda fdsa fdsa fdsa fdsa </td>
         <td>bbbb</td>
         <td>dddd</td>
     </tr>
</table>