<!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>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title></title>
<style>
.move {height: 200px; position: relative; 300px;}
.move div {background: #fff; border: 1px solid #ccc; height: 100%; position: absolute; 100%;}
.move div .title {background: #eee; border: 0; height: 20px; position: relative; cursor:move;}
.left {float: left;}
.clear {float: none; clear: both;}
</style>
</head>
<body>
<script type="text/javascript">
var Obj;
document.onmouseup=MUp;// 事件会在鼠标按键被松开时发生
document.onmousemove=MMove;//事件会在鼠标指针移动时发生。
function MDown(objMove, event) {//事件会在鼠标按键被按下时发生
Obj = objMove.parentNode;
if (window.event) {
event = window.event;
Obj.setCapture();
}
else {
window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);
}
pX=event.clientX-Obj.offsetLeft;
pY=event.clientY-Obj.offsetTop;
}
function MMove(event) {
if (window.event) event = window.event;
if(Obj){
Obj.style.left=event.clientX-pX + "px";
Obj.style.top=event.clientY-pY + "px";
}
}
function MUp(event) {
if(Obj){
if (window.event) Obj.releaseCapture();
else window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);
Obj=null;
}
}
</script>
</body>
<div class="move left">
<div>
<div class="title" onmousedown="MDown(this, event);">Title</div>
77989807070970707079079079079797979790
</div>
</div>
</html>