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

　　<div id="dialog_createUserGroup" class="dialog_main" style="">

　　<div id="McreateUserGroup">

　　<div class="title">

　　<span class="poptitle">新建用户组</span>

　　<span class="dialog_close" title="关闭" onClick="closeUserGroup();">

　　<img src='/images/close.png' alt='close' class='user_img' title='关闭'/>

　　</span>

　　</div>

　　<!--新建联系人-->

　　<div class="popContent">

　　<span class="localinfo" style="padding:10px 10px 0 46px;">组名称</span>

　　<input type="text" id="userGroupName" name="userGroupName" class="input_info" value="" style="width:265px;">

　　<img src='/images/ok.png' alt='ok' class='user_img' title='ok' style="display: none;" id="email_ok"/>

　　<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">用   户</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;">描   述</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;">确　定</a>　　　

　　<a href="javascript:void(0);" class="dialog_btn2" onclick="closeUserGroup();">取　消</a>

　　</div>

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

　　});

　　});