- From: Andrea Rendine <master.skywalker.88@gmail.com>
- Date: Tue, 6 Dec 2016 11:30:45 +0100
- To: www-style <www-style@w3.org>
> Could you explain how it possible?
I think this could be a basic example.
div:in-view(all) {
height: 1000px;
/* or an equivalent property incrementing vertical dimension of the element */
}
div:in-view(partial), div:in-view(none) {
height: auto;
/* reverting to a normal dimension */
}
/* this case could also be div:not(:in-view(partial)) */
So:
1. the element is fully visible, its height is increased.
2. Its height exceeds the viewport.
3. It's now only partially visible.
4. So its height is reduced.
5. Now it fits the viewport.
6. Go back to 1 and restart.
Here's an infinite loop, at least until the user scrolls the page (or
closes it altogether) in frustration.
Other example:
div:in-view(none) {
position: fixed;
}
1. The element is not visible. Selector applies.
2. Now it's the most visible element of all. So selector no longer applies.
3. The element goes away in sadness. But stop! Selector applies again!
4. The element is confused.
Basically, every time a property influences the presence of the
element in the viewport, it must be checked again. If the element is
no longer present, other properties might apply, even by default,
reverting it in a different state.
Received on Tuesday, 6 December 2016 10:32:13 UTC