Was ist der richtige Weg, um für HTML-Elemente eine Begrenzungsbox relativ zum Fenster zu erhalten?

Question

Ich schreibe eine Firefox-Erweiterung. Ich versuche, es auf nur XUL + Javascript (kein XPCOM) zu beschränken. Wenn ich ein mouseover Ereignis für ein HTML-Element erhalte, muss ich seine Bounding-Box im Windows-Koordinatensystem (das ist der integrierte XUL-Dokument browser.xul) bekommen.

Der offensichtliche Ort zu starten ist in den Mouseover-Event-Handler, so etwas zu sagen:

var rect = e.target.getBoundingClientRect(); 

Das ist sehr gut, aber das gibt mir die rect im Koordinatensystem der HTML-Dokuments, das die relativ obere linke Ecke des HTML-Zeichenbereichs. Ich möchte ein xul: panel-Element mit panel.openPopup() in der Nähe dieses Bildes anzeigen (aber nicht eines der vordefinierten popup positions), also muss ich die Koordinaten übersetzen.

Ich habe versucht, Folgendes zu tun (in der XUL dom), um den Offset zu bekommen, um die Übersetzung zu tun, und es funktioniert für einige Seiten, aber nicht alle, und scheint nicht die x-Übersetzung zu berücksichtigen für Seitenleisten.

var appcontent = document.getElementById("appcontent"); 
if (appcontent) { 
    chromeOffsetX = r.left; 
    chromeOffsetY = r.top; 
} 

Also, was ist der beste Weg, um dies zu nähern?

Hinweis: für IE-Erweiterungen würde ich verwenden (und haben) IDisplayServices::TransformRect() -ist es etwas ähnliches für Firefox?

Jetzt mit Kopfgeld!

Answer 1

Stellt sich heraus, immer die Lage ist nicht relevant, da Sie Elemente in Bezug auf das Element mit so etwas wie positionieren kann:

hoverPanel.openPopup(someElement, "overlap", offsetX, offsetY, false, false); 

Answer 2

This question hat Code, der das x und y eines Elements relativ zum sichtbaren Fenster ausarbeitet. Nicht sicher, ob es deine Frage beantwortet.