鼠标拖动层-FF下鼠标位置不正常的问题

<!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=gb2312" />
<title>无标题文档</title>
<style type="text/css">
body{position:relative; background:#000;margin:0px; padding:0px;}
.moveDiv{ position:absolute; border:#fff 2px solid;}
#tishi{ position:absolute; border:#fff 2px dashed;z-index:99999; display:none;}
</style>
<script type="text/javascript">
var start_x,start_y,move_x,move_y,end_x,end_y,div_x,div_y,td_x,td_y;
var isMove=false;
var isCreate=true;
var isDown=false;
document.onmousedown=function(e){
if(isMove==false && isCreate==true){
e = e||event;
start_x = e.clientX;
start_y = e.clientY;
isDown=true;
document.onmousemove=function(e){
if(isDown){
e = e||event;
move_x = e.clientX-start_x>0?start_x:e.clientX;
move_y = e.clientY-start_y>0?start_y:e.clientY;
var _move=document.getElementById("tishi");
_move.style.display="block";
_move.style.width=Math.abs(e.clientX-start_x)+"px";
_move.style.height=Math.abs(e.clientY-start_y)+"px";
_move.style.left=move_x+"px";
_move.style.top=move_y+"px";
}
}
}
}
document.onmouseup=function(e){
if(isMove==false && isCreate==true){
e = e||event;
end_x = e.clientX;
end_y = e.clientY;
div_x=end_x-start_x>0?start_x:end_x;
div_y=end_y-start_y>0?start_y:end_y;
var div_len=document.getElementsByTagName("div").length;
var c1=Math.round(Math.random()*100);
var c2=100-Math.round(Math.random()*100);
var c3=Math.round(Math.random()*100);
var opacity=Math.round(Math.random()*10)+60;
if(end_x-start_x!=0 && end_y-start_y!=0){
var _div=document.createElement("div");
_div.style.width=Math.abs(end_x-start_x)+"px";
_div.style.height=Math.abs(end_y-start_y)+"px";
_div.style.left=div_x+"px";
_div.style.top=div_y+"px";
_div.style.filter="alpha(opacity="+opacity+")";
_div.style.opacity=opacity/100;
_div.className="moveDiv";
_div.style.backgroundColor="rgb("+c1+"%,"+c2+"%,"+c3+"%)";
_div.style.zIndex=div_len;
_div.onselectstart=function(){return false;};
_div.onmousedown=function(){div_down(this,e);};
document.body.appendChild(_div);
}
isDown=false;
document.getElementById("tishi").style.display="none";
}else{
isMove=false;
isCreate=true;
document.onmousemove="";
var td_div=document.getElementsByTagName("div");
for(var i=0;i<=td_div.length-1;i++){
td_div[i].style.cursor="default";
}
}
}function div_down(x,e){
stopBubble(e);
isMove=true;
isCreate=false;
x.style.cursor="move";
window.getSelection?window.getSelection().removeAllRanges():document.selection.empty();//不选择内容
var td_div=document.getElementsByTagName("div");
var nowIndex=x.style.zIndex;
//alert(nowIndex);
for(var i=0;i<td_div.length;i++){
td_div[i].style.zIndex--;
}
x.style.zIndex=td_div.length;
e = e||event;
td_x=e.clientX-x.offsetLeft;
td_y=e.clientY-x.offsetTop;
document.onmousemove=function(e){
if(isMove==true && isCreate==false){
e = e||event;
x.style.left=e.clientX-td_x+"px";
x.style.top=e.clientY-td_y+"px";
//document.getElementById("shuzi").innerHTML=td_x+","+e.clientX;
}
}
}function stopBubble(e){
if(e&&e.stopPropagation){
e.stopPropagation();
}else{
window.event.cancelBubble=true;
}
}
</script>
</head><body>
<span id="tishi"></span>
</body>
</html>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

不好意思,我是LZ,刚忘记补充问题了.IE下非常正常,,主要是FF下,拖动的时候,,鼠标位置和层位置不一致,头绪全无,因为单独测试拖动代码的时候,是完全正常的.求指点......
在当 onmousedown div的时候需要将鼠标点击div的位置记录(相对于div左侧和上侧的位置，然后到时候在td_x、td_y获取的时候用这个来计算)
感谢上面回复的朋友过了3个月再回来看这个问题，今天有时间就检查了下 x.style.zIndex=td_div.length;
td_x=e.clientX-x.offsetLeft;
td_y=e.clientY-x.offsetTop;
x.innerHTML=e.clientX+","+e.clientY;
加了这个，查了下在 IE 里值是在DIV里点一次就获取一次，，FF里是点一下就一直都不会变了。。初步确定 FF下拖动的时候是位置获取不对然后再往下找原因。。在 document.onmousedown 里的 if 加了个 else          }else{
alert(1);
}发现点在DIV上时，，FF弹出了 1  ，奇怪的是，我明明写了阻止冒泡的 stopBubble 函数的啊再仔细检查，原来是 _div.onmousedown=function(){div_down(this,e);};中的 function () 没有传 e 进去，，汗一个所以最终的解决方法就是    _div.onmousedown=function(e){div_down(this,e);};OK，终于解决了，谢谢回复的朋友了