w3c / IntersectionObserver

Intersection Observer
https://www.w3.org/TR/intersection-observer/
Other
3.62k stars 523 forks source link

Define content clip #386

Closed szager-chromium closed 2 years ago

szager-chromium commented 5 years ago

Issue#351


Preview | Diff


Preview | Diff

szager-chromium commented 4 years ago

I think this should probably use https://drafts.csswg.org/css-overflow/#scroll-container instead.

There are elements for which the overflow-x/y styles don't necessarily create a scroll container (e.g., an <img> element, or an element with display: none).

"Scroll container" is not quite right, because it is defined as an element that can be scrolled by the user, whereas IntersectionObserver should be applying the clip regardless of whether the element is user scrollable. The first part of that spec section refers to CSS properties that "specify whether a box’s content (including any ink overflow) is clipped to its padding edge". I've updated the language to specify that IntersectionObserver will apply any padding edge clip mandated by that spec section.

emilio commented 4 years ago

it is defined as an element that can be scrolled by the user

Hmm, how so? <div style="overflow: hidden"></div> is not scrollable by the user but is a scroll container, right? I think the definition there is a bit poor but https://drafts.csswg.org/css-overflow/#valdef-overflow-hidden makes it clear...

szager-chromium commented 4 years ago

it is defined as an element that can be scrolled by the user

Hmm, how so? <div style="overflow: hidden"></div> is not scrollable by the user but is a scroll container, right? I think the definition there is a bit poor but https://drafts.csswg.org/css-overflow/#valdef-overflow-hidden makes it clear...

Here's the first line in that section of the spec:

"These properties specify whether a box’s content (including any ink overflow) is clipped to its padding edge, and if so, whether it is a scroll container that allows the user to scroll clipped parts of its scrollable overflow area into view."

So, "scroll container" is a subset of elements that have their content clipped to the padding edge; specifically, it refers to those elements that are user-scrollable. For IntersectionObserver, we want to apply the padding edge clip to the superset, including overflow:hidden and overflow:clip.

emilio commented 4 years ago

I think that's a bug in the css spec fwiw. <div style="overflow: hidden"> totally is a scroll container. But I overflow: clip isn't so... I guess this is fine to account for both.