¿Cuál es la forma correcta de obtener un cuadro delimitador para elementos HTML en relación con la ventana?

Estoy escribiendo una extensión de Firefox. Estoy tratando de limitarlo a solo XUL + Javascript (sin XPCOM). Cuando obtengo unmouseover evento para un elemento HTML, necesito obtener su cuadro delimitador en el sistema de coordenadas de Windows (que es el documento XUL incorporado browser.xul).

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

var rect = e.target.getBoundingClientRect();

Lo cual es genial, pero eso me da el 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 predefinidosposiciones emergentes), así que necesito traducir las coordenadas.

He intentado hacer lo siguiente (en el dom XUL) para obtener los desplazamientos para hacer la traducción, y funciona para algunos sitios, pero no para todos, y no parece tener en cuenta la traducción x necesaria para las 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 usaría (y he usado)IDisplayServices :: TransformRect ()¿Hay algo similar para Firefox?

Ahora con generosidad!

Respuestas a la pregunta(2)

Su respuesta a la pregunta