首页 > web前端 > js教程 > js拖动div 当鼠标移动时整个div也相应的移动_javascript技巧

js拖动div 当鼠标移动时整个div也相应的移动_javascript技巧

WBOY
发布: 2016-05-16 17:13:32
原创
1233 人浏览过

HTML代码如下,其中,要拖动的div为最外层的div

复制代码 代码如下:




新建用户组

close




组名称

ok


 


用   户





 


描   述










确 定   
取 消


js代码如下,
复制代码 代码如下:

$("#McreateUserGroup").mousedown(function(e){
var flag = true;
e = e||event;
var $dialog_createUserGroup = $("#dialog_createUserGroup");
var LEFT = e.clientX - parseInt($dialog_createUserGroup.css("left")),
TOP = e.clientY - parseInt($dialog_createUserGroup.css("top"));
$(document).mousemove(function (e) {
e = e || event;
if (flag) {
$dialog_createUserGroup.css({
"left": e.clientX - LEFT + "px",
"top": e.clientY - TOP + "px"
});
}
});
$(document).mouseup(function (e) {
flag = false;
});
});

这段代码对显示对话框的头部绑定鼠标监听事件,当鼠标移动时,整个div也相应的移动!
相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板