哪位高手帮忙看下,为什么层拖动到边界,鼠标滑过边界时,被拖动的层脱离鼠标,但是不放开鼠标时,仍然可以拖动层,只是鼠标不在层上。var offx=6,offy=6;
var moveable=false;var index=10000;//z-index;
//开始拖动;
function startDrag(obj)
{
//锁定标题栏;
obj.setCapture();//在属于当前线程的指定窗口里设置鼠标捕获
//定义对象;
var win = obj.parentNode;
//记录鼠标和层位置;

obj.x = event.x; //鼠标起始位置:x0
obj.y = event.y;//y0
obj.l = obj.offsetParent.offsetLeft; //父元素当前位置//x1
obj.t = obj.offsetParent.offsetTop;//y1
obj.w = obj.offsetParent.offsetWidth;
obj.h = obj.offsetParent.offsetHeight;
obj.ml = main.offsetLeft; //最大的层
obj.mt = main.offsetTop;
obj.mw = main.offsetWidth;
obj.mh = main.offsetHeight; moveable = true;
}
//拖动;
function drag(obj)
{
var win = obj.parentNode;
if(moveable)
{/***此处加上winWidth/2,是想被拖动的层的范围比父层稍大***/
widestr=win.style.width;
widelen=widestr.length;
winWidth=parseInt(widestr.substring(0,widelen-2));

cur = event.x - obj.x + obj.l; //父元素新位置 = 鼠标移过的位置 + 父元素原位置
cur = Math.max(cur, obj.ml - winWidth/2); //父元素的最小位置
win.style.left = Math.min(cur, obj.ml + obj.mw - obj.w +winWidth/2); //父元素的最大位置

heightstr=win.style.height;
heightlen= heightstr.length;
winHeight=parseInt(heightstr.substring(0,heightlen-2));                  cur = event.y - obj.y + obj.t;
cur = Math.max(cur, obj.mt - winHeight/2);
win.style.top = Math.min(cur, obj.mt + obj.mh - obj.h +winHeight/2);
}
}
//停止拖动;
function stopDrag(obj)
{
var win = obj.parentNode;
//放开标题栏;
obj.releaseCapture();
moveable = false;
}
//获得焦点;
function getFocus(obj)
{
index = index + 2;
var idx = index;
obj.style.zIndex=idx;
}

解决方案 »

  1.   

    document.onmouseout = function(){
    stopDrag(obj);
    }
      

  2.   

    楼上方法不可行,我所要达到的效果是鼠标在拖动过程中,只要不松开鼠标,即使鼠标脱离了该层,鼠标还是可以控制拖动。
    我后来发现,是event.x;的问题,这是得到鼠标与父层之间的距离,在拖动过程中,鼠标的父层发生了变化,所以就产生了跳动的现象。改成event.clientX就ok了。
    还是很谢谢楼上的帮助。
      

  3.   

    楼主并没有在onmouseout()追加方法