<html>
<head></head>
<body>
<div id="dMsgBody" style="border:1px solid;position:absolute ">
<div id="dTitle" style="background-color:#CCCCCC ">这是标题,拖动这里可以实现拖动效果</div>
<div id="dTxtBody">这是正文,拖动这里不可以实现拖协效果</div>
</div>
</body>
<script language="javascript">
var isDrag = false;
var objX;
var objY;
var obj = document.getElementById("dMsgBody");
var objTitle = document.getElementById("dTitle");
window.onload = startUp;
function startUp(){
document.onmousemove = mousemove;
objTitle.onmousedown = mousedown;
document.onmouseup = mouseup;
}
function mousemove(){
if(isDrag){
obj.style.pixelTop = event.clientY - objY;
obj.style.pixelLeft = event.clientX - objX;
}
}
function mousedown(){
isDrag = true;
objX = event.offsetX;
objY = event.offsetY;
}
function mouseup(){
if(isDrag){
isDrag = false;
}
}</script>
</html>
<head></head>
<body>
<div id="dMsgBody" style="border:1px solid;position:absolute ">
<div id="dTitle" style="background-color:#CCCCCC ">这是标题,拖动这里可以实现拖动效果</div>
<div id="dTxtBody">这是正文,拖动这里不可以实现拖协效果</div>
</div>
</body>
<script language="javascript">
var isDrag = false;
var objX;
var objY;
var obj = document.getElementById("dMsgBody");
var objTitle = document.getElementById("dTitle");
window.onload = startUp;
function startUp(){
document.onmousemove = mousemove;
objTitle.onmousedown = mousedown;
document.onmouseup = mouseup;
}
function mousemove(){
if(isDrag){
obj.style.pixelTop = event.clientY - objY;
obj.style.pixelLeft = event.clientX - objX;
}
}
function mousedown(){
isDrag = true;
objX = event.offsetX;
objY = event.offsetY;
}
function mouseup(){
if(isDrag){
isDrag = false;
}
}</script>
</html>
var objX,objY;
var obj,objTitle;
var iScroll; //是否让层随滚动条的滚动而滚,1表是滚动
function startUp(obj1,obj2,s){
obj = document.getElementById(obj1);
objTitle = document.getElementById(obj2);
iScroll = s;
obj.orig_x = parseInt(obj.style.left) - document.body.scrollLeft;
obj.orig_y = parseInt(obj.style.top) - document.body.scrollTop;
objTitle.onmousedown = function(){
isDrag = true;
this.style.cursor = "move";;
objX = window.event.clientX + document.body.scrollLeft - obj.offsetLeft;
objY = window.event.clientY + document.body.scrollTop - obj.offsetTop;
document.ondragstart = "return false;"
document.onselectstart = "return false;"
document.onselect = "document.selection.empty();"
if(obj.setCapture){
obj.setCapture();
}else if(window.captureEvents){
window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);
}
}
document.onmousemove = function(){
if(isDrag){
obj.style.left = window.event.clientX + document.body.scrollLeft - objX;
obj.style.top = window.event.clientY + document.body.scrollTop - objY;
obj.orig_x = parseInt(obj.style.left) - document.body.scrollLeft;
obj.orig_y = parseInt(obj.style.top) - document.body.scrollTop;
}
}
document.onmouseup = function(){
if(isDrag){
isDrag = false;
}
if(obj.releaseCapture){
obj.releaseCapture();
}else if(window.captureEvents){
window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);
}
//document.onmousemove = null;
//document.onmouseup = null;
document.ondragstart = null;
document.onselectstart = null;
document.onselect = null;
objTitle.style.cursor = "normal";
}
if(iScroll){
var orig_scroll = window.onscroll?window.onscroll:function (){};
window.onscroll = function (){
orig_scroll();
obj.style.left = obj.orig_x + document.body.scrollLeft;
obj.style.top = obj.orig_y + document.body.scrollTop;
}
}
}