Re: [csswg-drafts] [scroll-animations-1] Should range of ViewTimeline be clamped to scrollable range? (#7432)

One way we could eventually add support for clamped range animations without specifically adding a clamp parameter is to make a way to specify clamped phases or just the clamped phase of a timeline.

E.g. Given the following:
```html
<div id="scroller" style="overflow: auto; height: 200px">
  <div id="title" style="height: 50px;">Title</div>
  <div id="header" style="height: 100px;"></div>
  <div style="height: 1000px;"
</div>
```

Producing roughly the following layout where the header is half the height of the scrollport starting 50px down in the middle:
```
   #scroller
   -----------------
  |  Title          |
  |   ---------     |
  |  | #header |    |
  |  |         |    |
  |   ---------     |
  |                 |
   -----------------

```

The unclamped ViewTimeline will start at 50% (when `#scroller` has `scrollTop = 0`) and progress to 100% (when `#scroller` has `scrollTop = 150`. This means with a naive translation (to shift the header down as you scroll down), it will start shifted down from its initial position. 

We could support these particular cases without needing a clamped attribute on the timeline by adding a clamped / reachable (bikeshed) phase which corresponds to the actually reachable portions of the view timeline (i.e. in this case 50% to 100%).

-- 
GitHub Notification of comment by flackr
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7432#issuecomment-1194171031 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 25 July 2022 15:04:39 UTC