FxでJSポップアップを配置

Question

要素の下にポップアップを配置する次のコードがあります。これは、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); 

Answer 1

使用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でなければなりません。

Answer 2

トリックは、JavaScriptを使用してCSSと表示/非表示を使用することです。 CSSを使用すると、アイテムがブラウザに正確に表示される場所を指定できます。絶対位置は、ブラウザ内で項目が表示される場所を正確に定義します。相対的な位置付けは、既にページにある別のアイテムとの関係に基づいてアイテムがブラウザ内に配置される場所を定義します。この例では、ブラウザウィンドウの上端と左端から100ピクセルのイメージを配置し、2番目のイメージはその最初のイメージから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">