JS Drag div When the mouse moves the entire div also corresponding to the mobile _javascript tips

The HTML code is as follows, where the div to drag is the outermost div

Copy Code code as follows:

<div id= "Dialog_createusergroup" class= "Dialog_main" "style=" ">
<div id= "Mcreateusergroup" >
<div class= "title" >
<span class= "Poptitle" > New user Group </span>
<span class= "Dialog_close" title= Close "onclick=" Closeusergroup (); " >

</span>
</div>
<!--new Contact-->
<div class= "Popcontent" >
<span class= "Localinfo" style= "padding:10px 10px 0 46px;" > Group name </span>
<input type= "text" id= "Usergroupname" name= "Usergroupname" class= "Input_info" value= "" style= "width:265px;" >
<br>
<span id= "Usergroupname_info" style= "margin-left:100px; color:red; " > </span>
<br/>
<span class= "Localinfo" style= "padding:10px 10px 0 46px;margin-top:20px" > User </span>
<div style= "Padding-top:20px;width:265px;display:inline-block" >
<input type= "text" id= "Group_username" name= "Group_username" class= "Input_info" value= "" style= "width:280px;" >
</div>
<br>
<span id= "Name_info" style= "margin-left:100px; color:red; " > </span>
<br>
<span class= "Localinfo" style= "padding:10px 10px 0 46px;" > Description </span><br>
<textarea id= "Usergroup_displayname" class= "Textarea_comm" rows= "5" name= "Usergroup_displayname" style= "width : 265px;margin-left:100px; " ></textarea>
<br>
<br>
<br>
<br>
<a href= "javascript:void (0);" id= "save_contact_btn" class= "dialog_btn2" onclick= "Saveusergroup ();" Style= " margin-right:260px; " > OK </a>
<a href= "javascript:void (0);" class= "dialog_btn2" onclick= "Closeusergroup ();" > Cancel </a>
</div>

The JS code is as follows,

Copy Code code as follows:

$ ("#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;
});
});

This code for the Display dialog box of the head bound mouse listening event, when the mouse moves, the entire Div also move accordingly!