<
html
>
< head >
< meta http - equiv = " Content-Type " content = " text/html; charset=gb2312 " ></ head >
< BODY style = " margin:0;padding:0; " >
< 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 object ;
window.onload = startUp(document.getElementById( " dMsgBody " ));
function startUp(obj)...... {
obj.onmousemove = mousemove;
obj.onmousedown = mousedown;
obj.onmouseup = mouseup;
}
function mousemove()...... {
if ( object != null )...... {
object .style.pixelTop = event .clientY - object.objY;
object .style.pixelLeft = event .clientX - object.objX;
}
}
function mousedown( event ,obj)...... {
obj = obj || this ;
event = event || window. event ;
obj.setCapture();
object = obj;
// objX = event.offsetX;
// objY = event.offsetY;
obj. objX = event .clientX - obj.style.pixelLeft;
obj. objY = event .clientY - obj.style.pixelTop;
// alert(obj.offsetTop+" "+obj.style.pixelTop) offset是和body标签的距离,所以会有空隙才能等效,所以在body上加了css
}
function mouseup()...... {
if ( object != null )...... {
object .releaseCapture();
object = null
}
}
</ script >
</ html >
< head >
< meta http - equiv = " Content-Type " content = " text/html; charset=gb2312 " ></ head >
< BODY style = " margin:0;padding:0; " >
< 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 object ;
window.onload = startUp(document.getElementById( " dMsgBody " ));
function startUp(obj)...... {
obj.onmousemove = mousemove;
obj.onmousedown = mousedown;
obj.onmouseup = mouseup;
}
function mousemove()...... {
if ( object != null )...... {
object .style.pixelTop = event .clientY - object.objY;
object .style.pixelLeft = event .clientX - object.objX;
}
}
function mousedown( event ,obj)...... {
obj = obj || this ;
event = event || window. event ;
obj.setCapture();
object = obj;
// objX = event.offsetX;
// objY = event.offsetY;
obj. objX = event .clientX - obj.style.pixelLeft;
obj. objY = event .clientY - obj.style.pixelTop;
// alert(obj.offsetTop+" "+obj.style.pixelTop) offset是和body标签的距离,所以会有空隙才能等效,所以在body上加了css
}
function mouseup()...... {
if ( object != null )...... {
object .releaseCapture();
object = null
}
}
</ script >
</ html >
自己写了个,这个应该是比较简单通用的