鼠标拖动,可改变首列宽度

 function MouseDownToResize(obj)

{

 obj.mouseDownX=event.clientX; obj.pareneTdW=obj.parentElement.offsetWidth; obj.pareneTableW=theObjTable.offsetWidth; obj.setCapture();

}

function MouseMoveToResize(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 MouseUpToResize(obj)

 { obj.releaseCapture(); obj.mouseDownX=0; }

=============================================

<style> .resizeDivClass { position:relative; background-color:red; width:1; z-index:100; float:right; left:1; cursor:e-resize; }
</style>

============================================

<body MS_POSITIONING="GridLayout">
  改变table的列宽度
  <table id="theObjTable" STYLE="TABLE-LAYOUT:fixed; WIDTH:731px; HEIGHT:96px">
   <tr bgcolor="#cccccc">
    <td valign="top">
     <font οnmοusedοwn="MouseDownToResize(this);" οnmοusemοve="MouseMoveToResize(this);" οnmοuseup="MouseUpToResize(this);">
     </font>aaa</td>
    <td valign="top">
     <font class="resizeDivClass" οnmοusedοwn="MouseDownToResize(this);" οnmοusemοve="MouseMoveToResize(this);"
      οnmοuseup="MouseUpToResize(this);"></font>ddd</td>
    <td valign="top">
     <font class="resizeDivClass" οnmοusedοwn="MouseDownToResize(this);" οnmοusemοve="MouseMoveToResize(this);"
      οnmοuseup="MouseUpToResize(this);"></font>ddd</td>
   </tr>
   <tr>
    <td>aaaa fdsa fda fdsa fdsa fdsa fdsa fdsa fda fdsa fdsafdsa fdsa fdsa a</td>
    <td>bbbb</td>
    <td>dddd</td>
   </tr>
  </table>
 </body>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值