¿Cuál es la forma correcta de obtener un cuadro delimitador para los elementos HTML relativos a la ventana?

Question

Estoy escribiendo una extensión de Firefox. Intento limitarlo solo a XUL + Javascript (sin XPCOM). Cuando recibo un evento mouseover para un elemento HTML, necesito obtener su cuadro delimitador en el sistema de coordenadas de Windows (es decir, el navegador de documentos XUL integrado.xul).

El lugar obvio para comenzar es poner algo como esto en el controlador de eventos mouseover:

var rect = e.target.getBoundingClientRect(); 

que es grande, pero eso me da la rect en el sistema de coordenadas del documento HTML, que es relativo a la esquina superior izquierda del área de dibujo HTML. Quiero mostrar un elemento xul: panel usando panel.openPopup() cerca de esta imagen (pero no usando uno de los popup positions predefinidos), así que necesito traducir las coordenadas.

He intentado hacer lo siguiente (en el dominio XUL) para obtener el desplazamiento para hacer la traducción, y funciona para algunos sitios, pero no todos, y no parece tener en cuenta la traducción x necesaria para barras laterales

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

Entonces, ¿cuál es la mejor manera de abordar esto?

Nota: para las extensiones de IE me gustaría utilizar (y utilizado) IDisplayServices::TransformRect() -¿Hay algo similar para Firefox?

¡Ahora con bounty!

Answer 1

Resulta que cada vez que la ubicación es irrelevante porque se puede posicionar artículos relativos al elemento usando algo como:

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

Answer 2

This question tiene un código que calcula la xey de un elemento relativo a la ventana visible. No estoy seguro si responde tu pregunta.