首頁 > web前端 > js教程 > js拖曳div 當滑鼠移動時整個div也對應的移動_javascript技巧

js拖曳div 當滑鼠移動時整個div也對應的移動_javascript技巧

WBOY
發布: 2016-05-16 17:13:32
原創
1251 人瀏覽過

HTML程式碼如下,其中,要拖曳的div為最外層的div

複製程式碼 程式碼如下:




新建使用者群組

close




群組名稱

ok


  span>


用   戶





 


描   述









確定 a>   
取消


js程式碼如下,
複製程式碼 程式碼如下:

$("#McreateUser( ").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).mousemovefunction 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
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板