[css-transitions] On second thought, revert the previous change.

Tue, 10 Sep 2013 14:37:08 +0200

author
L. David Baron <dbaron@dbaron.org>
date
Tue, 10 Sep 2013 14:37:08 +0200
changeset 9093
7a7608bf0bb7
parent 9092
a666aaa9fd97
child 9094
94fe743b9684

[css-transitions] On second thought, revert the previous change.

css-transitions/Overview.html file | annotate | diff | comparison | revisions
css-transitions/Overview.src.html file | annotate | diff | comparison | revisions
     1.1 --- a/css-transitions/Overview.html	Tue Sep 10 14:32:19 2013 +0200
     1.2 +++ b/css-transitions/Overview.html	Tue Sep 10 14:37:08 2013 +0200
     1.3 @@ -1093,30 +1093,16 @@
     1.4  
     1.5    <p> If the current time is after the <a href="#start-time">start time</a>
     1.6     of the transition (that is, during the duration phase of the transition),
     1.7 -   this value is a specified style that will compute to the result of
     1.8 -   interpolating the property using the <span>before-change style</span> for
     1.9 -   the property as <i>V</i><sub>start</sub>, using the <span>after-change
    1.10 -   style</span> for the property as <i>V</i><sub>end</sub>, and using
    1.11 -   (current time - start time) / (end time - start time) as the input to the
    1.12 -   timing function (see ‘<a href="#transition-timing-function"><code
    1.13 -   class=property>transition-timing-function</code></a>’). (The
    1.14 +   this value is a specified style that will compute to the <a
    1.15 +   href="#animatable-types">result of interpolating the property</a> using
    1.16 +   the <span>before-change style</span> for the property as
    1.17 +   <i>V</i><sub>start</sub>, using the <span>after-change style</span> for
    1.18 +   the property as <i>V</i><sub>end</sub>, and using (current time - start
    1.19 +   time) / (end time - start time) as the input to the timing function. (The
    1.20     <span>before-change style</span> and <span>after-change style</span> <a
    1.21     href="#style-change-event">style change event</a> in which the transition
    1.22     was started.)
    1.23  
    1.24 -  <p> When interpolating between two values, <i>V</i><sub>start</sub> and
    1.25 -   <i>V</i><sub>end</sub>, interpolation is done using the output <i>p</i> of
    1.26 -   the timing function, which gives the portion of the value space that the
    1.27 -   interpolation has crossed. Thus the result of the interpolation is
    1.28 -   <i>V</i><sub>res</sub> = (1 - <i>p</i>) ⋅ <i>V</i><sub>start</sub> +
    1.29 -   <i>p</i> ⋅ <i>V</i><sub>end</sub>.
    1.30 -
    1.31 -  <p> However, if this value (<i>V</i><sub>res</sub>) is outside the allowed
    1.32 -   range of values for the property, then it is clamped to that range. This
    1.33 -   can occur if <i>p</i> is outside of the range 0 to 1, which can occur if a
    1.34 -   timing function is specified with a <i>y1</i> or <i>y2</i> that is outside
    1.35 -   the range 0 to 1.
    1.36 -
    1.37    <h2 id=reversing><span class=secno>5. </span> Automatically reversing
    1.38     interrupted transitions</h2>
    1.39  
    1.40 @@ -1307,6 +1293,19 @@
    1.41    <h2 id=animatable-types><span class=secno>7. </span><a
    1.42     id=animation-of-property-types-> Animation of property types </a></h2>
    1.43  
    1.44 +  <p> When interpolating between two values, <i>V</i><sub>start</sub> and
    1.45 +   <i>V</i><sub>end</sub>, interpolation is done using the output <i>p</i> of
    1.46 +   the timing function, which gives the portion of the value space that the
    1.47 +   interpolation has crossed. Thus the result of the interpolation is
    1.48 +   <i>V</i><sub>res</sub> = (1 - <i>p</i>) ⋅ <i>V</i><sub>start</sub> +
    1.49 +   <i>p</i> ⋅ <i>V</i><sub>end</sub>.
    1.50 +
    1.51 +  <p> However, if this value (<i>V</i><sub>res</sub>) is outside the allowed
    1.52 +   range of values for the property, then it is clamped to that range. This
    1.53 +   can occur if <i>p</i> is outside of the range 0 to 1, which can occur if a
    1.54 +   timing function is specified with a <i>y1</i> or <i>y2</i> that is outside
    1.55 +   the range 0 to 1.
    1.56 +
    1.57    <p> The following describes how each property type undergoes transition or
    1.58     animation.
    1.59  
     2.1 --- a/css-transitions/Overview.src.html	Tue Sep 10 14:32:19 2013 +0200
     2.2 +++ b/css-transitions/Overview.src.html	Tue Sep 10 14:37:08 2013 +0200
     2.3 @@ -1118,38 +1118,17 @@
     2.4          <span>start time</span> of the transition
     2.5          (that is, during the duration phase of the transition),
     2.6          this value is a specified style that will compute
     2.7 -        to the result of interpolating the property
     2.8 +        to the <a href="#animatable-types">result of interpolating the property</a>
     2.9          using the <span>before-change style</span> for the property as
    2.10          <i>V</i><sub>start</sub>,
    2.11          using the <span>after-change style</span> for the property as
    2.12          <i>V</i><sub>end</sub>,
    2.13          and using (current time - start time) / (end time - start time)
    2.14 -        as the input to the timing function (see 'transition-timing-function').
    2.15 +        as the input to the timing function.
    2.16          (The <span>before-change style</span> and <span>after-change style</span>
    2.17          <span>style change event</span> in which the transition was started.)
    2.18        </p>
    2.19  
    2.20 -      <p>
    2.21 -        When interpolating between two values,
    2.22 -        <i>V</i><sub>start</sub> and <i>V</i><sub>end</sub>,
    2.23 -        interpolation is done using the output <i>p</i> of the timing function,
    2.24 -        which gives the portion of the value space
    2.25 -        that the interpolation has crossed.
    2.26 -        Thus the result of the interpolation is
    2.27 -        <i>V</i><sub>res</sub> =
    2.28 -          (1 - <i>p</i>) &sdot; <i>V</i><sub>start</sub> +
    2.29 -          <i>p</i> &sdot; <i>V</i><sub>end</sub>.
    2.30 -      </p>
    2.31 -
    2.32 -      <p>
    2.33 -        However, if this value (<i>V</i><sub>res</sub>)
    2.34 -        is outside the allowed range of values for the property,
    2.35 -        then it is clamped to that range.
    2.36 -        This can occur if <i>p</i> is outside of the range 0 to 1,
    2.37 -        which can occur if a timing function is specified
    2.38 -        with a <i>y1</i> or <i>y2</i> that is outside the range 0 to 1.
    2.39 -      </p>
    2.40 -
    2.41        <h2 id="reversing">
    2.42          Automatically reversing interrupted transitions
    2.43        </h2>
    2.44 @@ -1345,6 +1324,27 @@
    2.45        </a></h2>
    2.46  
    2.47        <p>
    2.48 +        When interpolating between two values,
    2.49 +        <i>V</i><sub>start</sub> and <i>V</i><sub>end</sub>,
    2.50 +        interpolation is done using the output <i>p</i> of the timing function,
    2.51 +        which gives the portion of the value space
    2.52 +        that the interpolation has crossed.
    2.53 +        Thus the result of the interpolation is
    2.54 +        <i>V</i><sub>res</sub> =
    2.55 +          (1 - <i>p</i>) &sdot; <i>V</i><sub>start</sub> +
    2.56 +          <i>p</i> &sdot; <i>V</i><sub>end</sub>.
    2.57 +      </p>
    2.58 +
    2.59 +      <p>
    2.60 +        However, if this value (<i>V</i><sub>res</sub>)
    2.61 +        is outside the allowed range of values for the property,
    2.62 +        then it is clamped to that range.
    2.63 +        This can occur if <i>p</i> is outside of the range 0 to 1,
    2.64 +        which can occur if a timing function is specified
    2.65 +        with a <i>y1</i> or <i>y2</i> that is outside the range 0 to 1.
    2.66 +      </p>
    2.67 +
    2.68 +      <p>
    2.69          The following describes how each property type undergoes transition or
    2.70          animation.
    2.71        </p>

mercurial