鼠标可以拖动的嵌套表格(JavaScript)_层和布局特效

模板酷站
  •       3/5
  •       1
  •       2
  •       3
  •       4
  •       5
查看演示效果

      织梦DedeCMS视频教程买空间 租服务器 选网硕互联！ 无忧站长工具,百度权重一键全查!

      一款JavaScript代码，实现的效果是使被嵌套的表格可以在外层表格中拖动，而不能超出外表格的边框，类似层的拖动效果。

      <html> <head> <meta http-equiv="Content-Type" mrc="text/html; charset=gb2312"> <title>鼠标可以拖动的嵌套表格</title> </head> <body> <script> var isDraging=false;var ox,oy;function fnDown() { isDraging=true; ox=event.offsetX; oy=event.offsetY; mid.setCapture();} function fnMove() {if(event.button!=1) fnRelease(); if(isDraging){ var th=event.y-oTable.offsetTop-oy; if (th<1) th=1; if(th+parseInt(mid.height)>parseInt(oTable.height)) th=parseInt(oTable.height)-parseInt(mid.height); up.height=th; } } function fnUp(){fnRelease(); } function fnRelease() { isDraging=false; mid.releaseCapture();}</script> <BODY> <TABLE id=oTable width=360 height=312 border=1 cellspacing="0" cellpadding="0" > <TR> <TD id=up bgColor=#0066CC></TD></TR> <TR> <TD id=mid height=38 bgColor=#000000 onmousedown="fnDown()" onmousemove="fnMove()" onmouseup="fnUp"></TD> </TR> <TR> <TD id=down bgColor=#0066CC></TD></TR> </TABLE> </body> </html>

查看原文