Question

我有一个带有自定义上下文菜单的图库。当我右键单击图像时，菜单位置相对于光标坐标。

如果坐标+ div大小>窗口大小，div的位置改变，div应该在img内。

当我点击图像时，坐标+ div大小是＆lt;窗口大小，没有问题。问题是，当我点击坐标+ div大小为＆gt;的位置时窗口大小，有时它工作得很好，有时div位置似乎不遵循jvascript条件。我不明白。

以下是代码：

gary.addEventListener('contextmenu', gallery);
function gallery(e){
    e.preventDefault();
    var reh=e.clientY;
    var rey=e.clientX;
    var cnx=conxm.clientHeight;
    var cxm=conxm.clientWidth;
    var gig=window.innerHeight;
    var fgi=window.innerWidth;
    if((reh+cnx)>=gig && (rey+cxm)<=fgi){
        conxm.style.top=((gig-cnx)-10)+"px";
        conxm.style.left=rey+"px";
    }
    else if((reh+cnx)<=gig && (rey+cxm)>=fgi){
        conxm.style.top=reh+"px";
        conxm.style.left=((fgi-cxm)-10)+"px";
    }
    else if((reh+cnx)>=gig && (rey+cxm)>=fgi){
        conxm.style.top=((gig-cnx)-10)+"px";
        conxm.style.left=((fgi-cxm)-10)+"px";
    }
    else{
        conxm.style.top=reh+"px";
        conxm.style.left=rey+"px";
    }
    conxm.style.display="block";
}

<div id="curtain">
    <div id="txt">
    </div>
    <div id="rev">
        <img src="../img/revi.png" onClick="rvs()">
    </div>
        <img src="" name="gary">
    <div id="frw">
        <img src="../img/reviv.png" onClick="fwd()">
    </div>
</div>

编辑：如果为div定义宽度和高度，该函数仍然有效，但我需要宽度可变。

Answer 1

最后我简单地移动了

conxm.style.display="block";

前

e.preventDefault();

现在它完美无缺！

Div位置相对于光标坐标

1 个答案: