最簡短的拖動對象代碼實例演示

2019-11-21 02:27:00

字體：大中小

來源：轉載

供稿：網友

以前在網上看到的最簡單的拖動對象的代碼，忘記作者叫什么了。
原始代碼在IE下有些小問題，并且聲明了文檔類型為xhtml 1.0后，在FF等非IE瀏覽器下無效，對其進行了改進，現在已經可兼容:IE、Firefox、Opera ...
以下代碼只是演示原理，具體應用請結合你自己的實際需求進行修改。

<!doctype html public "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312"> <head> <title> 代碼實例：拖動對象 Drag Object (兼容:IE、Firefox、Opera ... )</title> <meta http-equiv="content-type" content="text/html; charset=gb2312" /> <meta name="editor" content="楓巖,http://www.cnlei.com"> <meta name="keywords" content="代碼實例：拖動對象"> <meta name="description" content="最簡短的拖動對象代碼實例演示"> <style> .dragAble {position:relative;cursor:move;} </style> <script language="javascript">  </script> </head> <body> <img src="http://www.iecn.net/images/user_icons/2006/10/01/u_35653.gif" class="dragAble" /> <img src="http://www.iecn.net/images/user_icons/2006/10/01/u_35653.gif" class="dragAble" /> <img src="http://www.iecn.net/images/user_icons/2006/10/01/u_35653.gif" class="dragAble" /> <div style="border:1px solid #ff6d00;background:#ffd801;width:240px;padding:5px 0;" class="dragAble">這些都是可拖動對象</div> </body> </html>

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

上一篇：禁止刷新，回退的JS

下一篇：用函數式編程技術編寫優美的 JavaScript