js 頁面模塊自由拖動實例

2024-05-06 14:15:47

字體：大中小

來源：轉載

供稿：網友

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>js頁面模塊自由拖動</title> <style> .removableObj { height:25;position:relative; } </style>  </head> <body> 用鼠標移動TD(本代碼也適合用鼠標進行其它對象的對換（如table,div等）) <table border="1" width="300"> <tr> <td bgcolor=red class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);" >a1</td> <td bgcolor=blue class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);" >a2</td> </tr> <tr> <td bgcolor=#cccccc class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);" >b1</td> <td bgcolor=#eeeeee class="removableObj" onmousedown='MouseDownToMove(this)' onmousemove='MouseMoveToMove(this)' onmouseup='MouseUpToMove(this);' onmouseover="MouseOverFun(this);" >b2</td> </tr> </table> </body> </html>

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]

上一篇：javascript html 靜態頁面傳參數

下一篇：javascript 極速隱藏/顯示萬行表格列只需 60毫秒