Compared with previous article, the drag and drop effect has been optimized.
js code: fun.js
_MoveObj = null ;//All variables, used to represent the current div
z_index = 0; //Z direction
jQuery.fn.myDrag=function(){
_IsMove = 0; // Whether to move 1. Move
_MouseLeft = 0; //div left coordinates
_MouseTop = 0; //div top coordinates
$(document).bind("mousemove",function(e){
if(_IsMove== 1){
$(_MoveObj).offset({top:e.pageY-_MouseLeft,left:e.pageX-_MouseTop});
}
}).bind("mouseup",function( ){
_IsMove=0;
$(_MoveObj).removeClass("downMouse");
});
return $(this).bind("mousedown",function(e){
_IsMove=1;
_MoveObj = this;
var offset =$(this).offset();
_MouseLeft = e.pageX - offset.left;
_MouseTop = e.pageY - offset.top;
z_index ;
_MoveObj.style.zIndex=z_index;
$(_MoveObj).addClass("downMouse");
});
}
html code:
demo.htm
Drag 1
Drag 2
Drag 3
Drag 4
Drag 5
Drag 6