@@ -37,6 +37,8 @@ urlPrefix: https://dom.spec.whatwg.org/; type: dfn; spec: dom
3737 text: event target
3838</pre>
3939<pre class=link-defaults>
40+ spec:cssom-1; type:dfn;
41+ text:property name; for:CSS declaration
4042spec:web-animations-1; type:dfn;
4143 text:active duration
4244 text:active phase; for:animation effect
@@ -73,8 +75,8 @@ spec:web-animations-2; type:dfn;
7375 text:default range
7476 text:exit range
7577spec:scroll-animations-1; type:dfn;
76- text:animation-range-start
77- text:animation-range-end
78+ text:animation-range-start
79+ text:animation-range-end
7880</pre>
7981
8082<h2 id="delta">Delta specification</h2>
@@ -127,12 +129,12 @@ the changes from the programming interface take precedence as follows:
127129 or after successfully setting the {{Animation/startTime}}
128130 on a {{CSSAnimation}} ,
129131 if, as a result of that call the [=play state=] of the
130- {{CSSAnimation}} changes to or from the [=paused play state=] ,
132+ {{CSSAnimation}} changes to or from the [=play state/paused=] play state ,
131133 any subsequent change to the 'animation-play-state' will no longer
132134 cause the {{CSSAnimation}} to be played or paused
133135 as defined in [[#animation-play-state]] .
134136
135- The requirement for a change to or from the [=paused play state=]
137+ The requirement for a change to or from the [=play state/paused=] state
136138 ensures that even after calling
137139 {{Animation/reverse()}} or setting the {{Animation/startTime}}
138140 on a running animation,
@@ -265,15 +267,14 @@ roughly the same composite order.
265267CSS Animations generated using the markup defined in this specification are
266268<em>not</em> added to the <a>global animation list</a> when they are created.
267269Instead, these animations are appended to the <a>global animation list</a> at
268- the first moment when they transition out of the <a>idle play state</a> after
269- being disassociated from their <a>owning element</a>.
270+ the first moment when they transition out of the [= play state/idle=] play state
271+ after being disassociated from their <a>owning element</a>.
270272CSS Animations that have been disassociated from their <a>owning element</a>
271- but are still <a lt="idle play state">idle</a> do not have a defined
272- composite order.
273+ but are still [=play state/idle=] do not have a defined composite order.
273274
274275Note, this behavior relies on the fact that disassociating an animation
275276from its <a>owning element</a> always causes it to enter (or remain) in the
276- <a> idle play state</a> .
277+ [=play state/ idle=] play state.
277278
278279<h2 id="keyframes">
279280Assembling Keyframes</h2>
@@ -286,7 +287,7 @@ See [[css-animations-1#keyframes]].
286287<h3 id="keyframe-processing">
287288Processing Keyframes</h3>
288289
289- For each animation effect defined by the <var>N</var>th item
290+ For each animation effect defined by the <var ignore='' >N</var> th item
290291in the [=coordinated value list=] of the 'animation-*' properties
291292on target (pseudo-)element |element|,
292293its associated [=keyframes=] are generated as follows:
@@ -306,7 +307,7 @@ its associated [=keyframes=] are generated as follows:
306307 |keyframe composite|,
307308 and |keyframe values|.
308309
309- * Let |animated properties| be an empty set of CSS property names.
310+ * Let |animated properties| be an empty set of CSS [= property names=] .
310311
3113121. <strong> Collect Declared Keyframes:</strong>
312313 1. Find the last ''@keyframes'' at-rule in document order
@@ -320,21 +321,21 @@ its associated [=keyframes=] are generated as follows:
320321 In this case no animation is generated,
321322 and any existing animation matching |name| is canceled.
322323
323- 1. Group together all [= keyframe blocks=]
324+ 1. Group together all << keyframe-block>> declarations
324325 that share the same [=specified value|specified=] <<keyframe-selector>>
325326 (treating ''@keyframe/from'' as ''0%'' and ''@keyframe/to'' as ''100%'' ),
326327 last declared 'animation-timing-function' [=computed value=]
327328 (defaulting to |default timing function| if there is no such declaration),
328329 and last declared 'animation-composition' [=computed value=]
329330 (defaulting to |default composite| if there is no such declaration).
330331
331- 1. For each such group of matching [= keyframe blocks=] ,
332- ordered by their earliest [= keyframe block=] in the sorted order:
332+ 1. For each such group of matching << keyframe-block>> declarations ,
333+ ordered by their earliest << keyframe- block>> in the sorted order:
333334
334335 1. [=Cascade=] together all of its [=declaration blocks=]
335336 such that for each CSS property
336337 (except those that are “not animatable”, which must be ignored)
337- the last declaration among all its [= keyframe blocks=]
338+ the last declaration among all its << keyframe-block>> declarations
338339 takes precedence.
339340 [[CSS-CASCADE-4]]
340341
@@ -343,14 +344,14 @@ its associated [=keyframes=] are generated as follows:
343344 and map together corresponding property pairs in each [=logical property group=]
344345 according to the |element|’s [=computed value|computed=] [=writing mode=] .
345346
346- 1. Append to |keyframes| a new empty [=keyframe=] |keyframe|
347+ 1. Append to |keyframes| a new empty [=keyframe=]
347348 with the group’s |keyframe offset|,
348349 |keyframe timing function|,
349350 and |keyframe composite|.
350351 Give its |keyframe values|
351352 the set of [=declared values=] resulting from this cascade.
352353
353- 1. Add each property name that was added to its |keyframe properties|
354+ 1. Add each [= property name=] that was added to its {{CSSKeyframesRule/cssRules}}
354355 to |animated properties|.
355356
3563571. <strong> Generate Initial and Final Frames:</strong>
@@ -470,11 +471,11 @@ Declaring Animations</h2>
470471 If the [=used value|used=] 'animation-duration' is ''0s'' ,
471472 the animation itself still occurs (instantaneously).
472473 The animation’s start and end events are still fired.
473- If 'animation-fill-mode' is set to '' backwards'' or '' both'',
474+ If 'animation-fill-mode' is set to ''single-animation-fill-mode/ backwards'' or ''single-animation-fill-mode/ both'' ,
474475 the first frame of the animation
475476 (as defined by 'animation-direction' )
476477 will be displayed during the 'animation-delay' ;
477- and if 'animation-fill-mode' is set to '' forwards'' or '' both'',
478+ and if 'animation-fill-mode' is set to ''single-animation-fill-mode/ forwards'' or ''single-animation-fill-mode/ both'' ,
478479 the last frame of the animation
479480 (as defined by 'animation-direction' )
480481 will be displayed after the 'animation-delay' .
@@ -746,25 +747,25 @@ The values of 'animation-trigger-behavior' have the following meaning
746747for an [=animation trigger=] that enters its [=animation trigger/active interval|active interval=] :
747748
748749<dl dfn-type=value dfn-for=animation-trigger-behavior>
749- <dt><dfn>once</dfn>
750- <dd>
751- The animation is triggered and played once and only once.
752-
753- <dt><dfn>repeat</dfn>
754- <dd>
755- The animation is played from the beginning each time it is triggered.
756- When the trigger’s [=animation trigger/active interval=] is exited the animation is reset.
757-
758- <dt><dfn>alternate</dfn>
759- <dd>
760- The animation is played forwards, according to its [=playback direction=], each time it is triggered.
761- When the trigger’s [=animation trigger/active interval=] is exited the animation is reversed.
762-
763- <dt><dfn>state</dfn>
764- <dd>
765- The animation is triggered and played once.
766- When the trigger’s [=animation trigger/active interval=] is exited the animation is paused.
767- When the trigger’s [=animation trigger/active interval=] is re-entered the animation is resumed.
750+ <dt> <dfn>once</dfn>
751+ <dd>
752+ The animation is triggered and played once and only once.
753+
754+ <dt> <dfn>repeat</dfn>
755+ <dd>
756+ The animation is played from the beginning each time it is triggered.
757+ When the trigger’s [=animation trigger/active interval=] is exited the animation is reset.
758+
759+ <dt> <dfn>alternate</dfn>
760+ <dd>
761+ The animation is played forwards, according to its [=playback direction=] , each time it is triggered.
762+ When the trigger’s [=animation trigger/active interval=] is exited the animation is reversed.
763+
764+ <dt> <dfn>state</dfn>
765+ <dd>
766+ The animation is triggered and played once.
767+ When the trigger’s [=animation trigger/active interval=] is exited the animation is paused.
768+ When the trigger’s [=animation trigger/active interval=] is re-entered the animation is resumed.
768769</dl>
769770
770771The behavior of each value is defined in [[web-animations-2#trigger-behaviors]] .
@@ -858,7 +859,7 @@ The 'animation-trigger-exit-range' property is a [=shorthand property|shorthand=
858859that sets 'animation-trigger-exit-range-start' and 'animation-trigger-exit-range-end'
859860together in a single declaration,
860861specifying the [=animation trigger=] ’s associated [=exit range=] .
861- It has the same syntax as the 'animation-range' property, with the addition of the '' auto'' keyword.
862+ It has the same syntax as the 'animation-range' property, with the addition of the ''animation-trigger-exit-range-start/ auto'' keyword.
862863
863864The [=exit range=] replaces the [=default range=] once the [=animation trigger=] ’s
864865[=animation trigger/active interval|active interval=] is entered,
@@ -888,31 +889,31 @@ associated [=exit range=].
888889The values of 'animation-trigger-exit-range-start' have the following meaning:
889890
890891<dl dfn-for="animation-trigger-exit-range-start" dfn-type=value>
891- <dt><dfn>auto</dfn>
892- <dd>
893- The start of the trigger’s [=exit range=]
894- is equal to the start of its [=default range=].
895-
896- <dt><dfn>normal</dfn>
897- <dd>
898- The start of the trigger’s [=exit range=]
899- is the start of its associated [=timeline=];
900- the start of the trigger’s [=animation trigger/active interval|active interval=]
901- is determined as normal.
902-
903- <dt><dfn><<length-percentage>></dfn>
904- <dd>
905- The [=exit range=] starts
906- at the specified point on the [=timeline=]
907- measuring from the start of the timeline.
908-
909- <dt><dfn><<timeline-range-name>> <<length-percentage>>?</dfn>
910- <dd>
911- The [=exit range=] starts
912- at the specified point on the [=timeline=]
913- measuring from the start of the specified [=named timeline range=].
914- If the <<length-percentage>> is omitted,
915- it defaults to 0%.
892+ <dt> <dfn>auto</dfn>
893+ <dd>
894+ The start of the trigger’s [=exit range=]
895+ is equal to the start of its [=default range=] .
896+
897+ <dt> <dfn>normal</dfn>
898+ <dd>
899+ The start of the trigger’s [=exit range=]
900+ is the start of its associated [=timeline=] ;
901+ the start of the trigger’s [=animation trigger/active interval|active interval=]
902+ is determined as normal.
903+
904+ <dt> <dfn><<length-percentage>></dfn>
905+ <dd>
906+ The [=exit range=] starts
907+ at the specified point on the [=timeline=]
908+ measuring from the start of the timeline.
909+
910+ <dt> <dfn><<timeline-range-name>> <<length-percentage>>?</dfn>
911+ <dd>
912+ The [=exit range=] starts
913+ at the specified point on the [=timeline=]
914+ measuring from the start of the specified [=named timeline range=] .
915+ If the <<length-percentage>> is omitted,
916+ it defaults to 0%.
916917</dl>
917918
918919## The 'animation-trigger-exit-range-end' property ## {#animation-trigger-exit-range-end}
@@ -934,31 +935,31 @@ associated [=exit range=].
934935The values of 'animation-trigger-exit-range-start' have the following meaning:
935936
936937<dl dfn-for="animation-trigger-exit-range-end" dfn-type=value>
937- <dt><dfn>auto</dfn>
938- <dd>
939- The end of the trigger’s [=exit range=]
940- is equal to the end of its [=default range=].
941-
942- <dt><dfn>normal</dfn>
943- <dd>
944- The end of the trigger’s [=exit range=]
945- is the end of its associated [=timeline=];
946- the end of the trigger’s [=animation trigger/active interval|active interval=]
947- is determined as normal.
948-
949- <dt><dfn><<length-percentage>></dfn>
950- <dd>
951- The [=exit range=] ends
952- at the specified point on the [=timeline=]
953- measuring from the start of the timeline.
954-
955- <dt><dfn><<timeline-range-name>> <<length-percentage>>?</dfn>
956- <dd>
957- The [=exit range=] ends
958- at the specified point on the [=timeline=]
959- measuring from the start of the specified [=named timeline range=].
960- If the <<length-percentage>> is omitted,
961- it defaults to 100%.
938+ <dt> <dfn>auto</dfn>
939+ <dd>
940+ The end of the trigger’s [=exit range=]
941+ is equal to the end of its [=default range=] .
942+
943+ <dt> <dfn>normal</dfn>
944+ <dd>
945+ The end of the trigger’s [=exit range=]
946+ is the end of its associated [=timeline=] ;
947+ the end of the trigger’s [=animation trigger/active interval|active interval=]
948+ is determined as normal.
949+
950+ <dt> <dfn><<length-percentage>></dfn>
951+ <dd>
952+ The [=exit range=] ends
953+ at the specified point on the [=timeline=]
954+ measuring from the start of the timeline.
955+
956+ <dt> <dfn><<timeline-range-name>> <<length-percentage>>?</dfn>
957+ <dd>
958+ The [=exit range=] ends
959+ at the specified point on the [=timeline=]
960+ measuring from the start of the specified [=named timeline range=] .
961+ If the <<length-percentage>> is omitted,
962+ it defaults to 100%.
962963</dl>
963964
964965## The 'animation-trigger' property ## {#animation-trigger}
0 commit comments