Skip to content

Commit 7872905

Browse files
author
Sylvain Galineau
committed
[css-animations] Start/end events are fired even when animation-duration is 0s
1 parent c7a8054 commit 7872905

File tree

2 files changed

+10
-19
lines changed

2 files changed

+10
-19
lines changed

css-animations/Overview.bs

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -434,10 +434,9 @@ The 'animation-duration' property</h3>
434434
If the <<time>> is ''0s'', like the initial value,
435435
the keyframes of the animation have no effect,
436436
but the animation itself still occurs instantaneously.
437-
That is, 'animation-fill-mode' applies as normal,
438-
filling backwards or forwards as appropriate.
439-
440-
<p class="issue">Do animation events fire when the duration is 0s?
437+
That is, 'animation-fill-mode' applies as normal,
438+
filling backwards or forwards as appropriate;
439+
start and end events are fired.
441440
</dl>
442441

443442
<h3 id="animation-timing-function">
@@ -781,11 +780,9 @@ Animation Events</h2>
781780
a single animation. Therefore an event will be generated for each 'animation-name' value and
782781
not necessarily for each property being animated.
783782

784-
Any animation for which both a valid keyframe rule and a non-zero duration are defined will run
783+
Any animation for which a valid keyframe rule is defined will run
785784
and generate events; this includes animations with empty keyframe rules.
786785

787-
<p class="issue">Clarify whether 0s animations fire start/end events or not.
788-
789786
The time the animation has been running is sent with each event generated. This allows the event
790787
handler to determine the current iteration of a looping animation or the current position of an
791788
alternating animation. This time does not include any time the animation was in the ''paused''

css-animations/Overview.html

Lines changed: 6 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -542,10 +542,9 @@ <h3 class="heading settled heading" data-level=4.3 id=animation-duration><span c
542542
<p> If the <a class="production css-code" data-link-type=type href=http://dev.w3.org/csswg/css-values-3/#time-value title="<time>">&lt;time&gt;</a> is <span class=css data-link-type=maybe title=0s>0s</span>, like the initial value,
543543
the keyframes of the animation have no effect,
544544
but the animation itself still occurs instantaneously.
545-
That is, <a class=property data-link-type=propdesc href=#propdef-animation-fill-mode title=animation-fill-mode>animation-fill-mode</a> applies as normal,
546-
filling backwards or forwards as appropriate.
547-
548-
<p class=issue id=issue-1275c8d8><a class=self-link href=#issue-1275c8d8></a>Do animation events fire when the duration is 0s?
545+
That is, <a class=property data-link-type=propdesc href=#propdef-animation-fill-mode title=animation-fill-mode>animation-fill-mode</a> applies as normal,
546+
filling backwards or forwards as appropriate;
547+
start and end events are fired.
549548
</dl>
550549

551550
<h3 class="heading settled heading" data-level=4.4 id=animation-timing-function><span class=secno>4.4 </span><span class=content>
@@ -805,11 +804,9 @@ <h2 class="heading settled heading" data-level=5 id=events><span class=secno>5 <
805804
a single animation. Therefore an event will be generated for each <a class=property data-link-type=propdesc href=#propdef-animation-name title=animation-name>animation-name</a> value and
806805
not necessarily for each property being animated.
807806

808-
<p> Any animation for which both a valid keyframe rule and a non-zero duration are defined will run
807+
<p> Any animation for which a valid keyframe rule is defined will run
809808
and generate events; this includes animations with empty keyframe rules.
810809

811-
<p class=issue id=issue-f9dd28a4><a class=self-link href=#issue-f9dd28a4></a>Clarify whether 0s animations fire start/end events or not.
812-
813810
<p> The time the animation has been running is sent with each event generated. This allows the event
814811
handler to determine the current iteration of a looping animation or the current position of an
815812
alternating animation. This time does not include any time the animation was in the <a class=css data-link-type=maybe href=#valuedef-paused title=paused>paused</a>
@@ -1343,9 +1340,6 @@ <h2 class="no-num no-ref heading settled heading" id=property-index><span class=
13431340
<tr><th scope=row><a data-property="">animation</a><td>&lt;single-animation&gt;#<td>see individual properties<td>all elements, ::before and ::after pseudo-elements<td>no<td>N/A<td>interactive<td>no<td>per grammar<td>As specified</table></div>
13441341

13451342

1346-
</ul><h2 class="no-num heading settled" id=issues-index><span class=content>Issues Index</span><a class=self-link href=#issues-index></a></h2><div style="counter-reset: issue"><div class=issue>Do animation events fire when the duration is 0s?
1347-
<a href=#issue-1275c8d8></a></div><div class=issue>If similar to animation-duration:0s, also relates to whether
1343+
</ul><h2 class="no-num heading settled" id=issues-index><span class=content>Issues Index</span><a class=self-link href=#issues-index></a></h2><div style="counter-reset: issue"><div class=issue>If similar to animation-duration:0s, also relates to whether
13481344
animation events fire?
1349-
<a href=#issue-ef1c522a></a></div><div class=issue>Clarify whether 0s animations fire start/end events or not.
1350-
1351-
<a href=#issue-f9dd28a4></a></div></div>
1345+
<a href=#issue-ef1c522a></a></div></div>

0 commit comments

Comments
 (0)