Re: [css3-transitions] Complex easing functions

On 10/04/2009, at 3:20 AM, Chris Marrin wrote:

>
> On Apr 8, 2009, at 7:46 PM, Dean Jackson wrote:
>
>>
>> On 09/04/2009, at 12:31 PM, Robert O'Callahan wrote:
>>
>>> It seems a lot easier to implement bounce effects by relaxing the  
>>> [0,1] constraint on curves than by implementing all of CSS  
>>> animations. (Especially since I find the case for CSS Transitions  
>>> a lot stronger than for Animations.) I'd support adding that.
>>
>> Bounce effects work well with extended timing functions, but only  
>> if you are doing positional animations (ie. moving an element).  
>> They don't work for doing things like fading from red to blue via  
>> green. For that you need keyframes.
>
>
> The timing function doesn't care about the type of the values being  
> animated. It simply applies a function to the timing variable used  
> to interpolate between the start and end values. It's easy to see  
> how applying this to a positional transition would give you a nice  
> bounce effect. For instance, going from 0px to 100px with some  
> overshoot would cause the value to go from 0px to 110px, back to  
> 90px, then settling on 100px eventually. You do this by making the  
> timing variable go from 0 to 1.1, then to 0.9, and eventually  
> having  it settle to 1.
>
> But you can apply this to color animations just as well. Going from  
> blue to red would follow the same path as before, it would just  
> "bounce" up to purple or something, which might not make a lot of  
> sense. But you can imagine that animating from a dark red to a  
> bright red and having it bounce to a bit brighter red might give you  
> a nice effect.

Sure, I think extending timing functions is going to be very useful.  
My example for keyframes was going outside what an extended timing  
function could offer (it's hard to imagine an author-friendly function  
that would always put green in the middle of every colour transition,  
no matter what the start and end colours are).

> I think that relaxing the [0,1] constraint of the timing variable  
> would require us to more tightly define the interpolation technique,  
> especially how clamping is handled. But I think it would not be hard  
> to spec.

Definitely. I think we should do it, I just wanted to make it clear  
that it isn't going to solve what keyframe animations are used for.

Dean

Received on Thursday, 9 April 2009 21:12:06 UTC