diff --git a/spec/e2e/html/1727_resize_scroll_top.html b/spec/e2e/html/1727_resize_scroll_top.html new file mode 100644 index 000000000..c003ac543 --- /dev/null +++ b/spec/e2e/html/1727_resize_scroll_top.html @@ -0,0 +1,56 @@ + + + + + + + + + + + + + +
This is the header which brings an offset of 200 px
+
+
+
+
+
+
+ + + + diff --git a/src/utils.ts b/src/utils.ts index 09abcaabb..86a98214b 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -351,16 +351,17 @@ export class Utils { static updateScrollResize(event: MouseEvent, el: HTMLElement, distance: number): void { const scrollEl = this.getScrollParent(el); const height = scrollEl.clientHeight; - - const top = event.clientY < distance; - const bottom = event.clientY > height - distance; + const offsetTop = scrollEl.getBoundingClientRect().top; + const pointerPosY = event.clientY - offsetTop; + const top = pointerPosY < distance; + const bottom = pointerPosY > height - distance; if (top) { // This also can be done with a timeout to keep scrolling while the mouse is // in the scrolling zone. (will have smoother behavior) - scrollEl.scrollBy({ behavior: 'smooth', top: event.clientY - distance}); + scrollEl.scrollBy({ behavior: 'smooth', top: pointerPosY - distance}); } else if (bottom) { - scrollEl.scrollBy({ behavior: 'smooth', top: distance - (height - event.clientY)}); + scrollEl.scrollBy({ behavior: 'smooth', top: distance - (height - pointerPosY)}); } } }