| 以下为引用的内容： <HTML> <HEAD> <title>拖拽定制窗口 百家拳软件项目研究室</title> <META http-equiv=Content-Type content="text/html; charset=UTF-8"> <script language="javascript" src="drag.js"></script> <link rel="stylesheet" href="style.css"> </HEAD> <body> <form id="Form1" method="post" runat="server"> <div id="news_root" style="LEFT:20px; TOP:20px" class="root"> <div id="news_handle" class="handle"> <div align="center">按住左键定制窗口</div> </div> <div id="news" class="text"> <p align="center"><a href="http://www.100jq.com" target="_blank">百家拳软件项目研究室</a></p> <p align="left"> 拖拽功能</p> </div> </div></form> <script language="javascript"> // 初始化新闻面板的拖拽效果 var news_handle = document.getElementById("news_handle"); var news_root = document.getElementById("news_root"); Drag.init(news_handle, news_root); news.style.backgroundColor = "#ffff00"; news.style.cursor = "hand"; </script> </body> </HTML> |
当触发了某一个事件之后，会通过表单提交出去。通过拖拽，javascript获得了对象的坐标的位置。再将这个坐标位置保存就可以了。在drag.js里面定义了5个函数。
init 初始化坐标的位置
start 开始鼠标拖拽的坐标处理
drag 拖拽过程的处理
end 拖拽结束的处理
fixE特殊位置的填充