Thu, 28 Jun 2012 11:44:32 -0700
Fix the definition of 'animation-fill-mode' as described in http://lists.w3.org/Archives/Public/www-style/2012Jun/0447.html .
1. account for 'reverse' and 'alternate-reverse' animation directions
2. account for the possibility that 'animation-iteration-count' is not an integer
css3-animations/Overview.html | file | annotate | diff | comparison | revisions | |
css3-animations/Overview.src.html | file | annotate | diff | comparison | revisions |
1.1 --- a/css3-animations/Overview.html Thu Jun 28 11:43:37 2012 -0700 1.2 +++ b/css3-animations/Overview.html Thu Jun 28 11:44:32 2012 -0700 1.3 @@ -1127,23 +1127,38 @@ 1.4 <p> If the value for ‘<a href="#animation-fill-mode"><code 1.5 class=property>animation-fill-mode</code></a>’ is ‘<code 1.6 class=css>backwards</code>’, then the animation will apply the property 1.7 - values defined in its 0% or ‘<code class=property>from</code>’ 1.8 - keyframe as soon as the animation is applied, during the period defined by 1.9 - ‘<code class=property>animation-delay</code>’. 1.10 + values defined in the keyframe that will start the first iteration of the 1.11 + animation, during the period defined by ‘<code 1.12 + class=property>animation-delay</code>’. These are either the values of 1.13 + the ‘<code class=css>from</code>’ keyframe (when ‘<a 1.14 + href="#animation-direction"><code 1.15 + class=property>animation-direction</code></a>’ is ‘<a 1.16 + href="#normal"><code class=css>normal</code></a>’ or ‘<a 1.17 + href="#alternate"><code class=css>alternate</code></a>’) or those of the 1.18 + ‘<code class=css>to</code>’ keyframe (when ‘<a 1.19 + href="#animation-direction"><code 1.20 + class=property>animation-direction</code></a>’ is ‘<a 1.21 + href="#reverse"><code class=css>reverse</code></a>’ or ‘<a 1.22 + href="#alternate-reverse"><code 1.23 + class=css>alternate-reverse</code></a>’). 1.24 1.25 <p> If the value for ‘<a href="#animation-fill-mode"><code 1.26 class=property>animation-fill-mode</code></a>’ is ‘<code 1.27 - class=css>forwards</code>’, then the animation will apply the property 1.28 - values defined in its last executing keyframe after the final iteration of 1.29 - the animation, until the animation style is removed. The last executing 1.30 - keyframe is the ‘<code class=property>to</code>’ or ‘<code 1.31 - class=css>100%</code>’ keyframe, unless the animation has ‘<a 1.32 - href="#animation-direction"><code 1.33 - class=property>animation-direction</code></a>’ set to ‘<a 1.34 - href="#alternate"><code class=css>alternate</code></a>’ and both a 1.35 - finite and even iteration count, in which case it is the ‘<code 1.36 - class=property>from</code>’ or ‘<code class=css>0%</code>’ keyframe. 1.37 - 1.38 + class=css>forwards</code>’, then after the animation ends (as determined 1.39 + by its ‘<a href="#animation-iteration-count"><code 1.40 + class=property>animation-iteration-count</code></a>’), the animation 1.41 + will apply the property values for the time the animation ended. When 1.42 + ‘<a href="#animation-iteration-count"><code 1.43 + class=property>animation-iteration-count</code></a>’ is an integer 1.44 + greater than zero, the values applied will be those for the end of the 1.45 + last completed iteration of the animation (rather than the values for the 1.46 + start of the iteration that would be next). When ‘<a 1.47 + href="#animation-iteration-count"><code 1.48 + class=property>animation-iteration-count</code></a>’ is zero, the values 1.49 + applied will be those that would start the first iteration (just as when 1.50 + ‘<a href="#animation-fill-mode"><code 1.51 + class=property>animation-fill-mode</code></a>’ is ‘<code 1.52 + class=css>backwards</code>’). 1.53 1.54 <p> If the value for ‘<a href="#animation-fill-mode"><code 1.55 class=property>animation-fill-mode</code></a>’ is ‘<code
2.1 --- a/css3-animations/Overview.src.html Thu Jun 28 11:43:37 2012 -0700 2.2 +++ b/css3-animations/Overview.src.html Thu Jun 28 11:44:32 2012 -0700 2.3 @@ -827,19 +827,29 @@ 2.4 2.5 <p> 2.6 If the value for 'animation-fill-mode' is ''backwards'', 2.7 - then the animation will apply the property values defined in its 0% or 'from' keyframe 2.8 - as soon as the animation is applied, 2.9 + then the animation will apply 2.10 + the property values defined in the keyframe 2.11 + that will start the first iteration of the animation, 2.12 during the period defined by 'animation-delay'. 2.13 + These are either the values of the ''from'' keyframe 2.14 + (when 'animation-direction' is ''normal'' or ''alternate'') 2.15 + or those of the ''to'' keyframe 2.16 + (when 'animation-direction' is ''reverse'' or ''alternate-reverse''). 2.17 2.18 <p> 2.19 If the value for 'animation-fill-mode' is ''forwards'', 2.20 - then the animation will apply the property values defined in its last executing keyframe 2.21 - after the final iteration of the animation, 2.22 - until the animation style is removed. 2.23 - The last executing keyframe is the 'to' or '100%' keyframe, 2.24 - unless the animation has 'animation-direction' set to ''alternate'' 2.25 - and both a finite and even iteration count, 2.26 - in which case it is the 'from' or '0%' keyframe. 2.27 + then after the animation ends 2.28 + (as determined by its 'animation-iteration-count'), 2.29 + the animation will apply 2.30 + the property values for the time the animation ended. 2.31 + When 'animation-iteration-count' is an integer greater than zero, 2.32 + the values applied will be 2.33 + those for the end of the last completed iteration of the animation 2.34 + (rather than the values for 2.35 + the start of the iteration that would be next). 2.36 + When 'animation-iteration-count' is zero, 2.37 + the values applied will be those that would start the first iteration 2.38 + (just as when 'animation-fill-mode' is ''backwards''). 2.39 2.40 <p> 2.41 If the value for 'animation-fill-mode' is ''both'',