Re: [css-transitions] Interpolation length, percentage, or calc

On Sunday 2013-09-08 00:10 -0700, Dirk Schulze wrote:
> I need help to interpret the following sentence on interpolation of length, percentage, or calc:
> 
> ""
> [..] both values are converted into a β€˜calc()’ function that is the sum of a length and a percentage (each possibly zero), and these β€˜calc()’ functions have each half interpolated as real numbers.
> ""
> 
> Just looking at the length to percentage case: If I have an interpolation off 20px to 20%, I have to create a calc() function for each of it of the following form?
> 
> calc(<length> + <percentage>)
> 
> What would be the value for the both calc() functions?

10% of the way from 20px to 20% would be calc(0.9 * 20px + 0.1 * 20%).
50% of the way from 20px to 20% would be calc(0.5 * 20px + 0.5 * 20%).
80% of the way from 20px to 20% would be calc(0.2 * 20px + 0.8 * 20%).

> What does need to be half interpolated? I must assume that the order (<length> + <percentage> vs <percentage> + <length>) matters in this case, right?

No, the order doesn't matter.

> Looking at length to calc: If I have 20px to calc(50% - 20px), how do the interpolation candidates look like?

10% of the way from 20px to calc(50% - 20px) would be
calc(0.9 * 20px + 0.1 * (50% - 20px)) which is the same as
calc(16px + 5%).

50% of the way from 20px to calc(50% - 20px) would be
calc(0.5 * 20px + 0.5 * (50% - 20px)) which is the same as
calc(0px + 25%).

80% of the way from 20px to calc(50% - 20px) would be
calc(0.2 * 20px + 0.8 * (50% - 20px)) which is the same as
calc(-12px + 40%).

-David

-- 
π„ž   L. David Baron                         http://dbaron.org/   𝄂
𝄒   Mozilla                          https://www.mozilla.org/   𝄂
             Before I built a wall I'd ask to know
             What I was walling in or walling out,
             And to whom I was like to give offense.
               - Robert Frost, Mending Wall (1914)

Received on Sunday, 8 September 2013 07:46:58 UTC