W3C home > Mailing lists > Public > www-style@w3.org > April 2012

Re: [css3-animations] Interaction of animation-delay and animation-iteration-count

From: Sylvain Galineau <sylvaing@microsoft.com>
Date: Tue, 10 Apr 2012 23:14:58 +0000
To: "www-style@w3.org" <www-style@w3.org>
Message-ID: <3C4041FF83E1E04A986B6DC50F01782909929313@TK5EX14MBXC295.redmond.corp.microsoft.com>
This refers to an issue raised on www-style [1] and logged in as bug 14807 [2]
regarding the interaction of animation-delay and animation-iteration-count.

The spec currently states that[3]:

# The 'animation-delay' property defines when the animation will start. 
# It allows an animation to begin execution some time after it is applied. 
# An 'animation-delay' value of '0s' means the animation will execute as 
# soon as it is applied. Otherwise, the value specifies an offset from 
# the moment the animation is applied, and the animation will delay 
# execution by that offset.

It then goes on to describe negative animation delays. The paragraph
above could instead refine the first sentence to define when delays are
applied:

# The 'animation-delay' property defines when the animation's first
# iteration will start. This allows an animation to begin execution 
# some time after it is applied. An 'animation-delay' value of '0s' 
# means the animation will execute as soon as it is applied. Otherwise, 
# the value specifies an offset from the moment the animation is applied, 
# and the animation will delay execution by that offset.

I think this would be sufficient to resolve the issue I raised. But while 
the basic effect of animation-delay is specified, we do not yet cover cases 
where the delay value is <= (-1 x animation-duration) i.e. what happens in 
the following cases:

1) animation-duration: 4s; animation-delay: -4s;
2) animation-duration: 4s; animation-delay: -5s;
3) animation-duration: 4s; animation-iteration-count: 2; animation-delay: -6s;
4) animation-duration: 4s; animation-iteration-count: 2; animation-delay: -8s;

The implementations I have tested - IE10 Beta, Firefox 11 and Chrome 18 - all
seem to agree that #1, #2 and #4 appear to do nothing i.e. these animations 
effectively complete as soon as they start. For #3, these implementations also 
agree to treat the -1.5x(animation-duration) delay as equivalent to a 
-0.5x(animation-duration) delay on the same animation with an iteration-count of 1. 
Which aligns with #4 being equivalent to #1 modulo the iteration-count multiplier.

(A simple testcase for the above is attached).

Any objections to specifying the current interoperable behavior?


[1] http://lists.w3.org/Archives/Public/www-style/2011Feb/0556.html
[2] https://www.w3.org/Bugs/Public/show_bug.cgi?id=14807
[3] http://dev.w3.org/csswg/css3-animations/#animation-delay-property




Received on Tuesday, 10 April 2012 23:15:38 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:52 GMT