Mercurial > drafts / changeset

     1.1 --- a/css-transitions/Overview.html	Mon Nov 11 18:46:26 2013 +0800
     1.2 +++ b/css-transitions/Overview.html	Mon Nov 11 18:48:28 2013 +0800
     1.3 @@ -1193,9 +1193,9 @@
     1.4     this value is a specified style that will compute to the <a
     1.5     href="#animatable-types">result of interpolating the property</a> using
     1.6     the <a href="#start-value">start value</a> of the transition as
     1.7 -   <i>V</i><sub>start</sub>, using the <a href="#end-value">end value</a> of
     1.8 -   the transition as <i>V</i><sub>end</sub>, and using (current time - start
     1.9 -   time) / (end time - start time) as the input to the timing function.
    1.10 +   <var>V</var><sub>start</sub>, using the <a href="#end-value">end value</a>
    1.11 +   of the transition as <var>V</var><sub>end</sub>, and using (current time -
    1.12 +   start time) / (end time - start time) as the input to the timing function.
    1.13  
    1.14    <h2 id=transition-events><span class=secno>5. </span><a
    1.15     id=transition-events-> Transition Events </a></h2>
    1.16 @@ -1315,18 +1315,19 @@
    1.17    <h2 id=animatable-types><span class=secno>6. </span><a
    1.18     id=animation-of-property-types-> Animation of property types </a></h2>
    1.19  
    1.20 -  <p> When interpolating between two values, <i>V</i><sub>start</sub> and
    1.21 -   <i>V</i><sub>end</sub>, interpolation is done using the output <i>p</i> of
    1.22 -   the timing function, which gives the portion of the value space that the
    1.23 -   interpolation has crossed. Thus the result of the interpolation is
    1.24 -   <i>V</i><sub>res</sub> = (1 - <i>p</i>) ⋅ <i>V</i><sub>start</sub> +
    1.25 -   <i>p</i> ⋅ <i>V</i><sub>end</sub>.
    1.26 -
    1.27 -  <p> However, if this value (<i>V</i><sub>res</sub>) is outside the allowed
    1.28 -   range of values for the property, then it is clamped to that range. This
    1.29 -   can occur if <i>p</i> is outside of the range 0 to 1, which can occur if a
    1.30 -   timing function is specified with a <i>y1</i> or <i>y2</i> that is outside
    1.31 -   the range 0 to 1.
    1.32 +  <p> When interpolating between two values, <var>V</var><sub>start</sub> and
    1.33 +   <var>V</var><sub>end</sub>, interpolation is done using the output
    1.34 +   <var>p</var> of the timing function, which gives the portion of the value
    1.35 +   space that the interpolation has crossed. Thus the result of the
    1.36 +   interpolation is <var>V</var><sub>res</sub> = (1 - <var>p</var>) ⋅
    1.37 +   <var>V</var><sub>start</sub> + <var>p</var> ⋅
    1.38 +   <var>V</var><sub>end</sub>.
    1.39 +
    1.40 +  <p> However, if this value (<var>V</var><sub>res</sub>) is outside the
    1.41 +   allowed range of values for the property, then it is clamped to that
    1.42 +   range. This can occur if <var>p</var> is outside of the range 0 to 1,
    1.43 +   which can occur if a timing function is specified with a <var>y1</var> or
    1.44 +   <var>y2</var> that is outside the range 0 to 1.
    1.45  
    1.46    <p> The following describes how each property type undergoes transition or
    1.47     animation.

     2.1 --- a/css-transitions/Overview.src.html	Mon Nov 11 18:46:26 2013 +0800
     2.2 +++ b/css-transitions/Overview.src.html	Mon Nov 11 18:48:28 2013 +0800
     2.3 @@ -1241,9 +1241,9 @@
     2.4          this value is a specified style that will compute
     2.5          to the <a href="#animatable-types">result of interpolating the property</a>
     2.6          using the <span>start value</span> of the transition as
     2.7 -        <i>V</i><sub>start</sub>,
     2.8 +        <var>V</var><sub>start</sub>,
     2.9          using the <span>end value</span> of the transition as
    2.10 -        <i>V</i><sub>end</sub>,
    2.11 +        <var>V</var><sub>end</sub>,
    2.12          and using (current time - start time) / (end time - start time)
    2.13          as the input to the timing function.
    2.14        </p>
    2.15 @@ -1360,23 +1360,23 @@
    2.16  
    2.17        <p>
    2.18          When interpolating between two values,
    2.19 -        <i>V</i><sub>start</sub> and <i>V</i><sub>end</sub>,
    2.20 -        interpolation is done using the output <i>p</i> of the timing function,
    2.21 +        <var>V</var><sub>start</sub> and <var>V</var><sub>end</sub>,
    2.22 +        interpolation is done using the output <var>p</var> of the timing function,
    2.23          which gives the portion of the value space
    2.24          that the interpolation has crossed.
    2.25          Thus the result of the interpolation is
    2.26 -        <i>V</i><sub>res</sub> =
    2.27 -          (1 - <i>p</i>) &sdot; <i>V</i><sub>start</sub> +
    2.28 -          <i>p</i> &sdot; <i>V</i><sub>end</sub>.
    2.29 +        <var>V</var><sub>res</sub> =
    2.30 +          (1 - <var>p</var>) &sdot; <var>V</var><sub>start</sub> +
    2.31 +          <var>p</var> &sdot; <var>V</var><sub>end</sub>.
    2.32        </p>
    2.33  
    2.34        <p>
    2.35 -        However, if this value (<i>V</i><sub>res</sub>)
    2.36 +        However, if this value (<var>V</var><sub>res</sub>)
    2.37          is outside the allowed range of values for the property,
    2.38          then it is clamped to that range.
    2.39 -        This can occur if <i>p</i> is outside of the range 0 to 1,
    2.40 +        This can occur if <var>p</var> is outside of the range 0 to 1,
    2.41          which can occur if a timing function is specified
    2.42 -        with a <i>y1</i> or <i>y2</i> that is outside the range 0 to 1.
    2.43 +        with a <var>y1</var> or <var>y2</var> that is outside the range 0 to 1.
    2.44        </p>
    2.45  
    2.46        <p>