您的位置:首页 > Web前端 > JQuery

Javascript实现Div可拖拽 (jquery)

2012-08-08 17:26 701 查看
这里面使用了Jquery,这个函数可以直接放在函数库里面使用!只需要将需要拖动的div给一个id,然后传递到这个函数里面,然后调用一下就可以了!

function dragAble(id){
var drag=false;
var startX,startY;
var objX,objY;
var _id = "#"+id;
var obj=$(_id);
obj.mouseup(function(e){
obj.css("cursor","");
drag=false;
});
$("document").mouseup(function(e){
obj.css("cursor","");
drag=false;
});
obj.mousedown(function(e){
obj.css("cursor","move");
drag=true;
startX=parseInt(e.clientX);
startY=parseInt(e.clientY);
objX=parseInt($(this).css("left"));
objY=parseInt($(this).css("top"));

});
obj.mousemove(function(e){
if(drag==true){
var left=parseInt(e.clientX)-startX+objX;
var top=parseInt(e.clientY)-startY+objY;
obj.css("top",top).css("left",left);
}
});
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: