今天用jquery实现了一个很简单的拖动...实现思路很简单 如下:
在thickbox 弹出层内实现拖拽DIV，那么得进行一下相对宽高的运算：必须加上相对于可见窗口宽高和弹出层宽高之间的差：
var x = event.clientX - (document.documentElement.clientWidth - 620) / 2 -
event.offsetX;
var y = event.clientY - (document.documentElement.clientHeight - 465) / 2 -
event.offsetY;
$(".pdivt .divnei").css("left",
x);
$(".pdivt .divnei").css("top", y);
event.offsetX eventoffsetY 发生事件的地点在事件源元素的坐标系统中的 x 坐标和 y 坐标。
event.clientX 获取鼠标的水平位置
event.clientY 获取鼠标的垂直位置
ousedown事件在鼠标在元素上点击后会触发mousemove
事件通过鼠标在元素上移动来触发mouseout事件在鼠标从元素上离开后会触发<style>
#Drigging
{
width:200px;
background:#CCC;
border:solid 1px
#666;
height:80px;
line-height:80px;
text-align:center;
position:absolute;
}
</style>
<script
src="../js/jquery-1.3.1.js"></script>
<script
type="text/javascript">
$(function(){
var
bool=false;
var offsetX=0;
var
offsetY=0;
$("#Drigging").mousedown(function(){
bool=true;
offsetX =
event.offsetX;
offsetY =
event.offsetY;
$(this).css(‘cursor‘,‘move‘);
})
.mouseup(function(){
bool=false;
})
$(document).mousemove(function(e){
if(!bool)
return;
var x =
event.clientX-offsetX;
var y =
event.clientY-offsetY;
$("#Drigging").css("left",
x);
$("#Drigging").css("top",
y);
})
})
</script> offsetParent:http://www.cnblogs.com/jilleanwong/archive/2008/09/21/1295415.htmloffsetLeft、offsetTop、offsetWidth、offsetHeight属性http://www.cnblogs.com/jilleanwong/archive/2008/09/22/1295783.html