分享一个简单的拖拽
2016-11-09 11:51
176 查看
<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style> #box{width:100px;height:100px;background:red;text-align:center;line-height:100px;color:#fff;position:absolute;left:0;top:0;} </style> <script> window.onload = function (){ var oBox = document.getElementById('box'); var disX = 0; var disY = 0; oBox.onmousedown = function ( ev ){ var ev = ev || window.event; disX = ev.clientX - this.offsetLeft; disY = ev.clientY - this.offsetTop; document.onmousemove = function ( ev ){ var ev = ev || window.event; oBox.style.left = ev.clientX - disX + 'px'; oBox.style.top = ev.clientY - disY + 'px'; ev.preventDefault && ev.preventDefault(); return false; } document.onmouseup = function (){ this.onmousemove = this.onmouseup = null; } } } </script> </head> <body> 其他文字<br /> 其他文字<br /> 其他文字<br /> 其他文字<br /> 其他文字<br /> <div id="box">拖拽</div> </body> </html>
相关文章推荐
- 无奈自己写了一个简单的JDBC查询缓存,分享一下
- 分享一个简单的日志记录静态类
- 分享一个简单的iphone自定义状态栏例子
- 分享自己做的一个简单的查询表达式模拟(ESQL,Linq)(3)
- 分享自己做的一个简单的查询表达式模拟(ESQL,Linq)(1)
- 一个最简单的js左右div分隔栏拖拽例子
- 分享一个小巧简单的基金查询工具(自己写的)
- 分享一个简单的页面刷新保持菜单不变的好东东
- 分享一个首页模块拖拽的清单
- 分享自己做的一个简单的查询表达式模拟(ESQL,Linq)(1)
- 网上找的一个超简单的JS拖拽
- 分享一个简单的python模板引擎
- 一个超简单的JS拖拽实现代码(兼容IE,Firefox)
- 基于jquery的一个简单拖拽功能
- 一个简单的优酷视频链接探测与分享功能
- 分享一个php验证码程序 简单 实用
- 分享一个简单而实用的缩略图方法
- 一个超简单的JS拖拽实现代码(兼容IE,Firefox)
- 找出超链接(无重复链接)-------自己有点小用,就简单写了一个,以后方便用,大家分享!
- 分享一个首页模块拖拽的清单