- From: Simon Fraser <smfr@me.com>
- Date: Wed, 13 Jan 2010 15:26:51 -0800
- To: Sylvain Galineau <sylvaing@microsoft.com>
- Cc: Nemeséri András <andris@nemeseri.com>, "www-style@w3.org" <www-style@w3.org>
On Jan 13, 2010, at 3:02 PM, Sylvain Galineau wrote: >> >> If you set the animation-duration to 0 there will be no movement at >> all. Because the animation "loop" will be finished in 0 second. > Hmm. That was not my expectation based on the semantics of zero duration > with transitions but you seem to be right. Zero means the animation never > starts vs. going to the last frame immediately. > > A zero second completion should not result in no animation of the property > value, it should result in an immediate update i.e. by default, CSS properties > have a zero duration and take their new value as you update them. But animations have no effect once they complete. So, logically, a zero-duration animation snaps to the last keyframe and then reverts back to its original appearance instantaneously. Practically, it's as if the animation never runs. Note that if we add "fill modes", then a zero-duration animation could have a visible manifestation. > >> You said: >> "tou can set animation-duration of 0 and animation-delay of 1s on each >> frame" >> >> How can I set animation-duration or animation-delay on each frame? The >> specification says that the "animation-timing-function" is the only >> animation related css property which can be set on keyframes: >> http://www.w3.org/TR/css3-animations/#animation-timing-function_tag > > > My bad, yes you're of course correct. The duration - and the other properties - > apply to the entire animation. You will thus be unable to achieve the effect > you want without specifying a positive duration. > > Going through these three steps in a way that is visible to the user not only > implies but requires a specific duration anyway. > > So what you want to control is the easing function i.e. you want one that updates > the property value at the very end of the frame period. I am not sure whether this > can be specified using the cubic-bezier() function... It cannot. We have considered the ability to specify stepwise timing functions (e.g. step-start, step-end or somesuch) to address this use case. Simon
Received on Wednesday, 13 January 2010 23:27:49 UTC