Skip to content

Commit 85f456a

Browse files
committed
[css-animations-2] Integrate scroll animations into animation-timeline #7579
1 parent 3942d16 commit 85f456a

File tree

1 file changed

+15
-8
lines changed

1 file changed

+15
-8
lines changed

css-animations-2/Overview.bs

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -536,7 +536,7 @@ Animatable: no
536536
</pre>
537537
538538
<pre class=prod>
539-
<dfn>&lt;single-animation-timeline></dfn> = auto | none | <<timeline-name>>
539+
<dfn>&lt;single-animation-timeline></dfn> = auto | none | <<timeline-name>> | <<scroll()>> | <<view()>>
540540
</pre>
541541
542542
The 'animation-timeline' property is similar to properties like 'animation-name'
@@ -557,13 +557,20 @@ the following effects:
557557
:: The animation is not associated with a [=timeline=].
558558
559559
: <dfn><<timeline-name>></dfn>
560-
:: Find the last timeline at-rule in document order with its name matching
561-
<<timeline-name>>. If such a timeline at-rule exists, then the animation's
562-
[=timeline=] is a timeline as defined by that rule. Otherwise the animation
563-
is not associated with a [=timeline=].
564-
<pre class=prod>
565-
<<timeline-name>> = <<custom-ident>> | <<string>>
566-
</pre>
560+
:: If a named [=scroll progress timeline=] or [=view progress timeline=]
561+
is in scope on this element,
562+
use the referenced timeline
563+
as defined in [[scroll-animations-1#timeline-scope]].
564+
565+
Otherwise the animation is not associated with a [=timeline=].
566+
567+
: <dfn><<scroll()>></dfn>
568+
:: Use the [=scroll progress timeline=] indicated by the given ''scroll()'' function.
569+
See [[scroll-animations-1#scroll-notation]].
570+
571+
: <dfn><<view()>></dfn>
572+
:: Use the [=view progress timeline=] indicated by the given ''view()'' function.
573+
See [[scroll-animations-1#view-notation]].
567574
</dl>
568575
569576

0 commit comments

Comments
 (0)