jQuery几行JS代码实现DIV拖拽很实用

先直接上代码,以后再解释

01	$(function(){

02	var _move=false;//移动标记

03	var _x,_y;//鼠标离控件左上角的相对位置

04	$(".drag").mousedown(function(e){

05	_move=true;

06	_x=e.pageX-parseInt($(".drag").css("left"));

07	_y=e.pageY-parseInt($(".drag").css("top"));

08	$(".drag").fadeTo(20, 0.5);//点击后开始拖动并透明显示

09

});

10	$(document).mousemove(function(e){

11	if(_move){

12	var x=e.pageX-_x;//移动时根据鼠标位置计算控件左上角的绝对位置

13	var y=e.pageY-_y;

14	$(".drag").css({top:y,left:x});//控件新位置

15

}

16	}).mouseup(function(){

17	_move=false;

18	$(".drag").fadeTo("fast", 1);//松开鼠标后停止移动并恢复成不透明

19

});

20

});

转载于:https://www.cnblogs.com/aspxnets/archive/2011/06/19/2084520.html