日期:2014-05-16  浏览次数:20332 次

层拖动的时候如何控制层不超过浏览器右边缘?
我这几天在做层拖动的时候碰到个问题,当层拖动到浏览器的最右边和最下边时,浏览器会出现滚动条,向右延伸,怎么样能使层到了浏览器右端时,不能再继续向右拖动?

JScript code

<script language="javascript">
var tmpObj;
var relLeft,relTop;
function layerMouseDown(obj)
{
    tmpObj=obj
    tmpObj.l=event.x-tmpObj.style.pixelLeft
    tmpObj.t=event.y-tmpObj.style.pixelTop
}

function layerMouseMove()
{
    if(tmpObj!=null)
    {    
        tmpObj.setCapture()

        tmpObj.style.left = event.x-tmpObj.l
        tmpObj.style.top = event.y-tmpObj.t
    }
}
function layerMouseUp()
{
    if(tmpObj!=null)
    {
        tmpObj.releaseCapture()
        tmpObj=null
    }
}
</script>


然后我的层代码为:
<div id="enterLayer" onmousedown="layerMouseDown(this)" onmousemove="layerMouseMove() " onmouseup="layerMouseUp()">层的具体内容</div>

我感觉应该在layerMouseMove()方法中加上对层位置的判断,可是不知道该如何判断。。。

------解决方案--------------------
JScript code

function layerMouseMove()
{
    if(tmpObj!=null)
    {    
        tmpObj.setCapture()

        tmpObj.style.left = event.x-tmpObj.l
        tmpObj.style.top = event.y-tmpObj.t

    var left=parseInt(tmpObj.style.left);
    var top=parseInt(tmpObj.style.top);
        var maxLeft=parseInt(document.body.clientWidth)-parseInt(tmpObj.style.width);
        var maxLeft=parseInt(document.body.clientHeight)-parseInt(tmpObj.style.height);
    if(left<0){
        tmpObj.style.left="0px";
    }
    if(left>maxLeft){
        tmpObj.style.left=maxLeft+"px";
    }
    if(top<0){
            tmpObj.style.top="0px";
    }
    if(top>maxTop){
        tmpObj.style.top=maxTop+"px";
    }
    }
}