看了有点类似google个性化主页中的
http://www.google.com/ig?hl=zh-CN
使用了ajax技术google用个开源的ajax架构可以去研究一下这么复杂的肯定不会有人提供代码的
附上个简单的吧
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
<style>
.removableObj
{
height:25;
position:relative;
left: 1px;
}
</style>
<script language="javascript" src="prototype.js"></script>
<script language="javascript">
var beginMoving=false;
var sourceObj=null;
var objectObj=null;
var objectObj2=null;
function MouseDownToMove(obj){
obj.style.zIndex=1;
obj.mouseDownY=event.clientY;
obj.mouseDownX=event.clientX;
beginMoving=true;
obj.setCapture();
sourceObj=obj;
objectObj=null;
}function MouseMoveToMove(obj){
    if(!beginMoving) return false;
obj.style.top = (event.clientY-obj.mouseDownY);
obj.style.left = (event.clientX-obj.mouseDownX);
}
function MouseUpToMove(obj){
if(!beginMoving) return false;
obj.releaseCapture();
obj.style.top=0;
obj.style.left=0;
obj.style.zIndex=0;
beginMoving=false;
window.setTimeout("swapFun()",20);
}function MouseOverFun(obj)
{
if(obj==sourceObj) return false;
objectObj=obj;
}function MouseOverFun2(obj)
{
objectObj2=obj;
}function swapFun()
{
if(sourceObj!=null && objectObj!=null) objectObj.insertAdjacentElement("beforeBegin",sourceObj);
else if(sourceObj!=null && objectObj2!=null) objectObj2.insertAdjacentElement("beforeEnd",sourceObj);
sourceObj=null;
objectObj=null;
objectObj2=null;
}
</script>
</head><body><table border="1" width="100%" height="58">
  <tr>
    <td width="34%" valign="top" height="46" onmouseover="MouseOverFun2(this);" >
    <input name="tableName" value="A" type="hidden">
      <table border="1" width="100%" bgcolor="#99CCFF" class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);" id="1">
        <tr>
          <td width="25%"><input name="tableName" value="1" type="hidden">表格1</td>
          <td >其它内容</td>
        </tr>
      </table><table border="1" width="100%" bgcolor="#FFCCFF" class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);"  id="2">
        <tr>
          <td width="25%"><input name="tableName" value="2" type="hidden">表格2</td>
          <td >其它内容</td>
        </tr>
      </table>
  <table border="1" width="100%" bgcolor="#00CC99" class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);"  id="3">
        <tr>
          <td width="25%"><input name="tableName" value="3" type="hidden">表格3</td>
          <td >其它内容</td>
        </tr>
      </table>
      
    </td>
    <td width="32%" valign="top" height="52" onmouseover="MouseOverFun2(this);" >
    <input name="tableName" value="B" type="hidden">
  <table border="1" width="100%" bgcolor="#FF0000" class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);"  id="4">
        <tr>
          <td width="25%"><input name="tableName" value="4" type="hidden">表格4</td>
          <td >其它内容</td>
        </tr>
      </table>    
      <table border="1" width="100%" bgcolor="#00FFFF" class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);"  id="5">
        <tr>
          <td width="25%"><input name="tableName" value="5" type="hidden">表格5</td>
          <td >其它内容</td>
        </tr>
      </table></td>
    <td width="34%" valign="top" height="52" onmouseover="MouseOverFun2(this);" >
    <input name="tableName" value="C" type="hidden">
  <table border="1" width="100%" bgcolor="#FF9966" class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);"  id="6">
        <tr>
          <td width="25%"><input name="tableName" value="6" type="hidden">表格6</td>
          <td >其它内容</td>
        </tr>
      </table>    
      <table width="100%" border="1" bgcolor="#FFFFCC" class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);"  id="7">
        <tr>
          <td width="25%"><input name="tableName" value="7" type="hidden">表格7</td>
          <td >其它内容</td>
        </tr>
      </table></td>
  </tr>
</table><input type=button value="保存示例" onclick="saveFun()">
</body>
</html>
<script>
function saveFun()
{
var tableNameObjs=document.getElementsByName("tableName");
var tempStr="";
for(var i=0;i<tableNameObjs.length;i++)
{
tempStr += tableNameObjs[i].value+"_";
}
alert(tempStr);}
</script>