麻豆小视频在线观看_中文黄色一级片_久久久成人精品_成片免费观看视频大全_午夜精品久久久久久久99热浪潮_成人一区二区三区四区

首頁 > 編程 > JavaScript > 正文

js拖動div 當鼠標移動時整個div也相應的移動

2019-11-20 21:37:23
字體:
來源:轉載
供稿:網友
HTML代碼如下,其中,要拖動的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>

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也相應的移動!
發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 成人一区二区三区四区 | 最新午夜综合福利视频 | 欧美日韩成人一区二区 | 国产一国产一级毛片视频 | 49vvv| 中文字幕四区 | 国产精品视频久 | 在线成人www免费观看视频 | 精品国产一区二区在线 | 欧美成人精品欧美一级 | 亚洲情av| 国产午夜亚洲精品理论片大丰影院 | 久久精品视频日本 | 激情久久一区二区 | 做羞羞视频 | 一本一道久久久a久久久精品91 | 国产毛片在线看 | 欧美a在线看 | 免费a级观看 | 中午日产幕无线码1区 | 日韩黄色精品 | 精品一区二区电影 | 第一区免费在线观看 | 国产精品免费麻豆入口 | 视频一区二区国产 | 最近免费观看高清韩国日本大全 | 国产午夜精品一区二区三区四区 | 无码专区aaaaaa免费视频 | 国内性爱视频 | 欧美xxxx精品另类 | 国产一级免费视频 | 一级做a爱性色毛片免费1 | 天使萌一区二区三区免费观看 | 黄色片网站在线免费观看 | 曰批全过程120分钟免费69 | 精品一区二区在线播放 | 在线成人亚洲 | 亚洲精品v天堂中文字幕 | 欧美成人鲁丝片在线观看 | 成人毛片免费视频 | 久色视频网站 |