<script language="javascript"> var move=false; function StartDrag(obj){ if(event.button==1&&event.srcElement.tagName.toUpperCase()=="DIV"){ obj.setCapture(); obj.style.background="#999"; move=true; } } function Drag(obj){ if(move){ var oldwin=obj.parentNode; oldwin.style.left=event.clientX-50; oldwin.style.top=event.clientY-10; } } function StopDrag(obj){ obj.style.background="#000"; obj.releaseCapture(); move=false; } </script> </head> <body> <div class="win1"> <div class="title" onMousedown="StartDrag(this)" onMouseup="StopDrag(this)" onMousemove="Drag(this)" >窗口1 </div> This is a moveable window. <br> This is a moveable window. <br> </div> </body> </html>
参见:easyDragDropnew easyDragDrop(dragArea,moveArea,aMatrix,dashedMove) 拖拽类构造函数 参数:可拖动元素,需要移动的元素,可拖动范围[上,右,下,左],是否虚框拖拽easyDragDrop属性: dragArea 拖拽对象 moveArea 移动对象 aMatrix 可移动范围 dashedMove 是否开启虚线框移动 dashedBox 虚框 cm 是否指定了移动范围 x 移动对象当前的x坐标 y 移动对象当前的y坐标easyDragDrop事件: onbeforedrag 拖动前事件,形参(x,y) ondrag 拖动时事件,形参(x,y) ondrop 拖动放开后事件,形参(x,y)easyDragDrop方法:getMASize() 获取移动对象当前大小 参数:无 返回值:[width,height]
DragForm.jsvar move=false;
function StartDrag(obj)
{
if(event.button==1&&event.srcElement.tagName.toUpperCase()=="DIV")
{
obj.setCapture();
obj.style.background="#999";
move=true;
}
}function Drag(obj)
{
if(move)
{
var oldwin=obj.parentNode;
oldwin.style.left=event.clientX-50;
oldwin.style.top=event.clientY-10;
}}function StopDrag(obj)
{
obj.style.background="#000";
obj.releaseCapture();
move=false;
} //HTML Code:
HTMLPage.htm<!--Force IE6 into quirks mode with this comment tag-->
<!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" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="DragForm.css" rel="stylesheet" type="text/css">
<script language="javascript" type="text/javascript" src="DragForm.js"></script>
<title>Dynamic Drive: CSS Top Frame Layout</title></head>
<body><div class="win1">
<div class="title" onMousedown="StartDrag(this)" onMouseup="StopDrag(this)" onMousemove="Drag(this)" >窗口1</div>
This is a moveable window.<br>
This is a moveable window.<br>
</div>
</body>
</html>
//CSS Code:
DragForm.cssbody{font-family:Verdana;font-size:11px;color:#333;}.win1{[position:absolute;left:100;top:100;width:200px;height:150px;border:1px solid #000;}
.title{width:100%;background:#000;height:18px;color:#fff;cursor:hand;}
<!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>
<title>无标题页</title>
<style type="text/css">
body{font-family:Verdana;font-size:11px;color:#333;}
.win1{[position:absolute;left:100;top:100;width:200px;height:150px;border:1px solid #000;}
.title{width:100%;background:#000;height:18px;color:#fff;cursor:hand;}
</style>
<script language="javascript">
var move=false;
function StartDrag(obj){
if(event.button==1&&event.srcElement.tagName.toUpperCase()=="DIV"){
obj.setCapture();
obj.style.background="#999";
move=true;
}
} function Drag(obj){
if(move){
var oldwin=obj.parentNode;
oldwin.style.left=event.clientX-50;
oldwin.style.top=event.clientY-10;
}
} function StopDrag(obj){
obj.style.background="#000";
obj.releaseCapture();
move=false;
}
</script>
</head>
<body>
<div class="win1">
<div class="title" onMousedown="StartDrag(this)" onMouseup="StopDrag(this)" onMousemove="Drag(this)" >窗口1 </div>
This is a moveable window. <br>
This is a moveable window. <br>
</div> </body>
</html>
拖拽类构造函数
参数:可拖动元素,需要移动的元素,可拖动范围[上,右,下,左],是否虚框拖拽easyDragDrop属性: dragArea 拖拽对象
moveArea 移动对象
aMatrix 可移动范围
dashedMove 是否开启虚线框移动
dashedBox 虚框
cm 是否指定了移动范围
x 移动对象当前的x坐标
y 移动对象当前的y坐标easyDragDrop事件: onbeforedrag 拖动前事件,形参(x,y)
ondrag 拖动时事件,形参(x,y)
ondrop 拖动放开后事件,形参(x,y)easyDragDrop方法:getMASize()
获取移动对象当前大小
参数:无
返回值:[width,height]
不知你是如何Ctrl+C、Ctrl+V的
错误信息呢?