Javascript 在Fx中定位JS弹出窗口

Javascript 在Fx中定位JS弹出窗口,javascript,firefox,popup,Javascript,Firefox,Popup,我有下面的代码将弹出窗口放置在元素下。只有当Fx窗口最大化时,此选项才能正常工作。我应该添加什么来解释窗口相对于屏幕的位置,以便它也适用于正常模式下的窗口 var elm = document.getElementById("back-forward-dropmarker"); var x = elm.boxObject.x; var y = elm.boxObject.y + elm.boxObject.height + 19; document.getElementById("backFor

我有下面的代码将弹出窗口放置在元素下。只有当Fx窗口最大化时,此选项才能正常工作。我应该添加什么来解释窗口相对于屏幕的位置,以便它也适用于正常模式下的窗口

var elm = document.getElementById("back-forward-dropmarker");
var x = elm.boxObject.x;
var y = elm.boxObject.y + elm.boxObject.height + 19;
document.getElementById("backForwardMenu").showPopup(elm, x, y, "popup", null, null);

诀窍是使用CSS和javascript显示/隐藏。使用CSS,您可以准确定位项目在浏览器中的显示位置。绝对位置精确定义项目在浏览器中的显示位置。相对定位根据项目与页面上已存在的其他项目的关系定义项目在浏览器中的位置。在本例中,我们将浏览器窗口顶部和左侧的100个像素放置在图像上,第二个图像将从该初始图像渲染200个像素

<img style="position: absolute; top: 100px; left: 100px;" 
src="images/logo1.gif">

<img style="position: relative; top: 200px; left: 200px;" 
src="images/logo2.gif">

使用boxObject.screenX,screenY代替x,y:

var elm = document.getElementById("back-forward-dropmarker");
var mnu = document.getElementById("backForwardMenu");

var x = elm.boxObject.screenX;
var y = elm.boxObject.screenY + elm.boxObject.height;

mnu.showPopup(elm, x, y, "popup", null, null);
但由于没有偏移,因此使用popupanchor和popupalign更简单:

mnu.showPopup(elm, -1, -1, "popup", "bottomleft", "topleft");
这意味着将弹出窗口的左上角放在元素的左下角旁边。注:在这种情况下,x和y必须为-1