Re: [css-shapes] Animating <basic-shape>s updated

On 1/15/14, 10:28 AM, "Alan Stearns" <stearns@adobe.com> wrote:

>On 1/14/14, 3:36 PM, "Tab Atkins Jr." <jackalmage@gmail.com> wrote:
>
>>On Mon, Jan 13, 2014 at 4:40 PM, Alan Stearns <stearns@adobe.com> wrote:
>>> Here’s a bit more detail and some examples on this topic. I’m writing
>>>out
>>> what I’ve gleaned from the discussion of computed values and
>>>serialization
>>> to see whether I’ve got things right (or if it sparks more debate). I
>>> think designing complex, multi-valued properties like shape-outside and
>>> border-position may be helped by using some guidelines.
>>
>>Yes, everything you write here is great and completely correct, as far
>>as I can tell!
>>
>>I've added it to the wiki at
>><http://wiki.csswg.org/spec/computed-values> for now to record it for
>>posterity.
>
>OK - so now let's look at these example:
>
>Declared value: right 10px
>Computed value: (100% - 10px), (50% + 0px)
>getComputedValue result: right 10px
>
>Declared value: bottom 50px top 10%
>Computed value: (10% + 0px), (100% - 50px)
>getComputedValue result: 10% bottom 50px
>
>And talk about what happens during interpolation. You can call
>getComputedStyle in an intermediate state, so how does the value get
>serialized then? If we animate between the two declared values above, and
>sample the value half-way through, the computed value is:
>
>(55% - 5px), (75% - 25px)
>
>In this case, I think the getComputedValue result is:
>
>calc(55% - 5px) calc(75% - 25px)
>
>I'm assuming that if the percentages in computed value are 0%, 50% or
>100%, then the serialization uses the keywords. But if the percentage is
>any other value, the serialization needs to use calc().
>
>
>Is this correct? Does this need to be spelled out in the definition of
>background-position?

Fantasai pointed out that my example used an incorrect interpretation of
the two-value <position> syntax. The first value should be:

Declared value: right 10px center
Computed value: (100% - 10px), (50% + 0px)
getComputedValue result: right 10px center

Thanks,

Alan

Received on Wednesday, 15 January 2014 19:23:38 UTC