js拖动侯如何用程序保存它拖动后的位置??
2个回答
展开全部
拖动分下面几个步骤:按下(mousedown),拖曳(onmousemove),放开(onmouseup)。
1)按下:记录拖动开始的坐标
2)拖曳:记录实时坐标
3)放开:记录放开时坐标
下面是一个拖动控件的示例,拖动是会显示坐标。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
</head>
<script>
var Drag = {
"dragObj" : null ,
"event" : null ,
"offx" : "",
"offy" : "",
"start" : function (e){
Drag.event = e ? e : (window.event ? window.event : null);
Drag.dragObj = Drag.event.target || Drag.event.srcElement;
Drag.dragObj.style.position="absolute";
Drag.dragObj.style.cursor="hand";
Drag.offx=Drag.event.clientX-Drag.dragObj.offsetLeft;
Drag.offy=Drag.event.clientY-Drag.dragObj.offsetTop;
document.onmousemove = Drag.draging ;
document.onmouseup = Drag.stop ;
},
"draging" : function(){
Drag.dragObj.style.top = Drag.event.clientY-Drag.offy;
Drag.dragObj.style.left = Drag.event.clientX-Drag.offx;
window.status = "X:" + Drag.event.clientX + " Y:" + Drag.event.clientY ;
//拖动时显示坐标
document.getElementById("dragDiv").innerHTML = "<span style='color:red;font:14px;'>" + "X:" + Drag.event.clientX + " Y:" + Drag.event.clientY + "</span>";
},
"stop" : function () {
Drag.event = null;
Drag.dragObj = null;
document.onmousemove = null ;
document.onmouseup = null ;
}
}
</script>
<body>
<div id = "dragDiv" name="dragDiv" onmousedown="Drag.start(event)" style="position:relative ;border:1px;border-style:solid;width:200px">
javascript 对象拖动类
</div>
</body>
</html>
1)按下:记录拖动开始的坐标
2)拖曳:记录实时坐标
3)放开:记录放开时坐标
下面是一个拖动控件的示例,拖动是会显示坐标。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
</head>
<script>
var Drag = {
"dragObj" : null ,
"event" : null ,
"offx" : "",
"offy" : "",
"start" : function (e){
Drag.event = e ? e : (window.event ? window.event : null);
Drag.dragObj = Drag.event.target || Drag.event.srcElement;
Drag.dragObj.style.position="absolute";
Drag.dragObj.style.cursor="hand";
Drag.offx=Drag.event.clientX-Drag.dragObj.offsetLeft;
Drag.offy=Drag.event.clientY-Drag.dragObj.offsetTop;
document.onmousemove = Drag.draging ;
document.onmouseup = Drag.stop ;
},
"draging" : function(){
Drag.dragObj.style.top = Drag.event.clientY-Drag.offy;
Drag.dragObj.style.left = Drag.event.clientX-Drag.offx;
window.status = "X:" + Drag.event.clientX + " Y:" + Drag.event.clientY ;
//拖动时显示坐标
document.getElementById("dragDiv").innerHTML = "<span style='color:red;font:14px;'>" + "X:" + Drag.event.clientX + " Y:" + Drag.event.clientY + "</span>";
},
"stop" : function () {
Drag.event = null;
Drag.dragObj = null;
document.onmousemove = null ;
document.onmouseup = null ;
}
}
</script>
<body>
<div id = "dragDiv" name="dragDiv" onmousedown="Drag.start(event)" style="position:relative ;border:1px;border-style:solid;width:200px">
javascript 对象拖动类
</div>
</body>
</html>
追问
但是当我把一个块里的东西拖动到另一个块中,这个块就会撑开,那么里面本身的东西的位置也变了 我该怎么获取呢?您能给我把保存说的更详细些吗 谢谢啦
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询