Skip to content

Can we have an option to compound rootMargin values with the "optimal viewing region"/scroll-padding? #371

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
jonjohnjohnson opened this issue Jun 24, 2019 · 2 comments

Comments

@jonjohnjohnson
Copy link

https://drafts.csswg.org/css-scroll-snap-1/#optimal-viewing-region

In the css scroll-snap spec, which I know is separate from the intersection observer spec, a concept called the optimal viewing region is defined, and is set by the scroll-padding property for a scrollport/root. Aside from the property, there has also been talk of heuristics to infer this optimal viewing region from fixpos/stickypos elements obfuscating areas of a scrollport. Either way, when using intersectionObserver I've found myself wanting to compound my rootMargin values off my currently rendered optimal viewing region.

I wonder if @tabatkins can corroborate that I'm making sense here? What do you think @ojanvafai?

@szager-chromium
Copy link
Collaborator

szager-chromium commented Aug 21, 2019

It seems like this could be polyfilled (pseudo-code without string conversions or "px" stripping):

new IntersectionObserver(callback, { root: scroller, rootMargin: -getComputedStyle(scroller).scrollPadding });

?

@jonjohnjohnson
Copy link
Author

It seems like this could be polyfilled

Sure and this is what I've done, though with more complications like handling the computed value of scroll-padding changing to do relayout or matchMedia updates. But even if it can be hacked in, it could still be aided by a keen "auto optimal viewing region" value for rootMargin, like why intersectionObserver was created as a way to not just polyfill the behavior with scroll events?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants