171099 2017-04-20 22:08:23 -0700 Implement scroll anchoring 2026-03-05 13:41:36 -0800 1 1 1 Unclassified WebKit Scrolling Safari 10 Unspecified Unspecified RESOLVED DUPLICATE 307734 https://bugs.webkit.org/show_bug.cgi?id=259269 InRadar P2 Normal --- 243309 243482 243702 261628 1 rbyers webkit-unassigned alex augus.dupin benniercruz cdumez cory curlyhairiscrucial dino emmbacklinks esprehn fabienbrooke hartman.wiki kngan lwdthe1 matt mustafa.0x nmouchtaris ntim rbuis ryan santiago.velez seanmacisaac simon.fraser the.bull webkit-bug-importer woodlxf00 oldest_to_newest 1299500 0 rbyers 2017-04-20 22:08:23 -0700 Scroll anchoring is a feature designed to avoid unintended jumps of the content while (or even after) a page is loading - keeping what the user is looking at in view. It relies on some heuristics to avoid web compat issues, but includes an explicit opt-out API (overflow-anchor CSS property) for sites designed not to need it. It took quite a bit of iteration to get the web compat right, but it's now been shipping since Chrome 56 without issue, so we're convinced it has stuck. We're seeing about 11% of page views on Android trigger anchoring logic at least once, and about 6% on desktop. Summary / video: https://blog.chromium.org/2017/04/scroll-anchoring-for-web-developers.html Explainer: https://github.com/WICG/ScrollAnchoring/blob/master/explainer.md Draft spec: https://wicg.github.io/ScrollAnchoring CSSWG discussion: https://github.com/w3c/csswg-drafts/issues/676 Blink implementation: https://cs.chromium.org/chromium/src/third_party/WebKit/Source/core/layout/ScrollAnchor.cpp Feel free to file issues (https://github.com/WICG/ScrollAnchoring/issues) for any concerns, questions or suggestions. Let us know if you think you might implement and we'll try to get some web-platform-tests upstreamed (https://github.com/WICG/ScrollAnchoring/issues/3) 1299501 1 dino 2017-04-20 22:12:17 -0700 We're interested in implementing this. I'll add it to the WebKit Status page. 1299505 2 webkit-bug-importer 2017-04-20 22:24:28 -0700 <rdar://problem/31751673> 1761662 3 curlyhairiscrucial 2021-05-19 12:53:42 -0700 Scroll anchoring would really help simplify things. Was hoping to leverage this for a jump-to-specific-spot-on-page-load feature (where the browser default of jumping to element with ID that matches the URL fragment can't be used since the content is asynchronously retrieved). Unfortunately, the lack of current WebKit support for this feature requires I find some way to avoid everything jumping down when content above the scrolled-to spot loads in. Is there an update on timing/priority for this? I looked in the feature status (https://webkit.org/status/) for this, but didn't see an entry. 1908073 4 mustafa.0x 2022-10-25 06:55:44 -0700 This is an important feature for many apps, especially chat apps. Web developers often complain that that Safari lacks this feature. Eg https://www.bennadel.com/blog/3724-maintaining-scroll-offsets-when-adding-content-above-the-users-viewport-in-angular-9-0-0-rc-2.htm 1925396 5 rbuis 2023-01-13 11:10:33 -0800 *** Bug 250578 has been marked as a duplicate of this bug. *** 1935454 6 hartman.wiki 2023-02-21 02:17:58 -0800 This is a significant problem on Wikipedia right now, where the browsers are picking an incorrect place to anchor when you initially navigate to a page anchor quite often in their newer skin (which has its navigation elements before the content where most anchors are). See also: https://phabricator.wikimedia.org/T330108#8631197 On most browsers this will be mitigated with overflow-anchor:none being applied to the menu elements that we don't want the browser to anchor to, but unfortunately it is not supported in Webkit see https://caniuse.com/?search=overflow-anchor and https://bugs.webkit.org/show_bug.cgi?id=109640 1950070 7 matt 2023-04-20 08:29:38 -0700 WebKit CSS Feature Status says overflow-anchor is supported, but e.g. this demo seems to indicate it doesn't work: https://css-tricks.com/almanac/properties/o/overflow-anchor/#aa-demo Is overflow-anchor expected to work? Should I test differently? Thanks for your work on this important feature. 1950079 8 ntim 2023-04-20 08:39:59 -0700 (In reply to Matt Reimer from comment #7) > WebKit CSS Feature Status says overflow-anchor is supported That is misleading, it is currently not implemented, we should probably update this. 1998862 9 ntim 2023-12-11 19:05:07 -0800 *** Bug 109640 has been marked as a duplicate of this bug. *** 2011443 11 lwdthe1 2024-02-07 10:25:23 -0800 Please fix this bug. Scroll Anchoring is crucial in the modern web with chat experiences, which require reverse infinite scrolling. 2011464 12 matt 2024-02-07 11:09:52 -0800 (In reply to lwdthe1 from comment #11) > Please fix this bug. Scroll Anchoring is crucial in the modern web with chat > experiences, which require reverse infinite scrolling. Try the current Tech Preview. It seems to be working pretty well, at least for my use cases. 2081852 15 mustafa.0x 2024-12-14 20:35:57 -0800 Has the implementation been finalized? I use it in a somewhat popular web app, and safari tp's behavior differs from chrome. 2165498 16 santiago.velez 2025-12-12 12:27:43 -0800 Hello, any updates on this feature? is it in active development? 2187493 17 simon.fraser 2026-03-05 13:41:36 -0800 *** This bug has been marked as a duplicate of bug 307734 ***