From c8b0272ca8dae69e18c60d7f65cb1678b3b97769 Mon Sep 17 00:00:00 2001 From: Davide Tantillo Date: Thu, 27 Mar 2025 09:14:35 +0100 Subject: [PATCH] Overlay needs to consider border if it's scrollable. --- spine-ts/spine-webgl/src/SpineWebComponentWidget.ts | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/spine-ts/spine-webgl/src/SpineWebComponentWidget.ts b/spine-ts/spine-webgl/src/SpineWebComponentWidget.ts index cafd5c336..27236282d 100644 --- a/spine-ts/spine-webgl/src/SpineWebComponentWidget.ts +++ b/spine-ts/spine-webgl/src/SpineWebComponentWidget.ts @@ -1724,7 +1724,14 @@ class SpineWebComponentOverlay extends HTMLElement implements OverlayAttributes, renderer.begin(); let ref: DOMRect; - if (this.scrollable) ref = this.parentElement!.getBoundingClientRect(); + let offsetLeftForOevrlay = 0; + let offsetTopForOverlay = 0; + if (this.scrollable) { + ref = this.parentElement!.getBoundingClientRect(); + const computedStyle = getComputedStyle(this.parentElement!); + offsetLeftForOevrlay = ref.left + parseFloat(computedStyle.borderLeftWidth); + offsetTopForOverlay = ref.top + parseFloat(computedStyle.borderTopWidth); + } const tempVector = new Vector3(); this.skeletonList.forEach((widget) => { @@ -1738,8 +1745,8 @@ class SpineWebComponentOverlay extends HTMLElement implements OverlayAttributes, divBounds.y = divBounds.top + this.overflowTopSize; if (this.scrollable) { - divBounds.x -= ref.left; - divBounds.y -= ref.top; + divBounds.x -= offsetLeftForOevrlay; + divBounds.y -= offsetTopForOverlay; } const { padLeft, padRight, padTop, padBottom } = widget