pon esto en tu archivo css.

 background: #000 !important; color: #0f0 !important; outline: solid #f00 1px !important; }

delineará todo el elemento en su código.

Si entiendo correctamente, entonces podría obtener el ancho del elemento y luego comparar 100vw - theWidthOfElement.

Si desea trabajar con coordenadas, simplemente desplace la ventana hacia la izquierda para obtener la coordenada x.

element.getBoundingClientRect() devuelve un objeto con propiedades que incluyen .width y .height .

Estos son el ancho y el alto de un elemento, y continúan fuera de la pantalla (por lo que, en su caso, serán más grandes que las dimensiones de la ventana gráfica).

https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect

También puede encontrar útiles las .left , .right , .top y .bottom de .getBoundingClientRect() . Estos, nuevamente, se extienden más allá de la pantalla, devolviendo valores negativos para la izquierda y la parte superior, y números más grandes que la ventana gráfica para la derecha y la parte inferior.

A menudo, el elemento (su pdf o su contenedor) se define mediante un evento de clic, pero los dispositivos móviles dependen de touchEvent s (y los errores al aplicarlos parecen interferir con .getBoundingClientRect() , así que tenga cuidado. (consulte: getBoundingClientRect está vacío en el móvil ).

Podría hacer un fragmento de demostración aquí, pero no estoy en un dispositivo móvil para probar y podría confundir a los usuarios de otros dispositivos. La página de MDN en .getBoundingClientRect() debería ayudarte.