W3C home > Mailing lists > Public > www-style@w3.org > April 2009

Re: [css3-transitions] Complex easing functions

From: Andrew Fedoniouk <news@terrainformatica.com>
Date: Wed, 08 Apr 2009 19:51:04 -0700
Message-ID: <49DD6298.1080204@terrainformatica.com>
To: robert@ocallahan.org
CC: Dean Jackson <dino@apple.com>, Jon Rimmer <jon.rimmer@gmail.com>, www-style@w3.org
Robert O'Callahan wrote:
> On Tue, Apr 7, 2009 at 4:51 PM, Dean Jackson <dino@apple.com 
> <mailto:dino@apple.com>> wrote:
> 
>     On 03/04/2009, at 9:26 PM, Jon Rimmer wrote:
> 
>         After reading though the current transitions draft, I am
>         wondering about support for more advanced easing functions, with
>         more complex curves and values that fall outside the range [0,
>         1]. Such functions are required for 'elastic' or 'bounce'
>         transitions, which are a popular way of providing more natural
>         easing, particularly for movement, but do not seem possible with
>         the current proposal. There is a useful easing functions
>         visualiser here that provides samples for each type:
>         http://www.robertpenner.com/easing/easing_demo.html
> 
>         This sort of easing is possible using JavaScript libraries, such
>         as Mootools or jQuery with the easing plugin, and it be a shame
>         if the transitions module were not to include an equivalent
>         degree of capability. Is there a reason why the proposal could
>         not be modified to allow multiple bezier curvers within a timing
>         function, and allow values to fall outside the range [0, 1], so
>         long as the final values ended at 0,0 or 1,1?
> 
> 
>     We agree that more complex timing functions should be added. My
>     hesitation is that I'd like to start with as small a specification
>     as possible, and then add features later. However, this isn't really
>     a difficult feature to implement, so we're willing to add it if the
>     community and other implementors agree. Is there anyone else
>     listening who wants this immediately?
> 
>     The idea of multiple curves allowing values outside [0,1] is a good
>     suggestion.
> 
>     While it would be a little painful, you can still achieve you
>     elastic or bounce effects today using CSS animations with keyframes.
> 
>  
> 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.
> 
> Rob

If to relax [0,1] then 'cubic-bezier' value/function [1] has to be 
replaced by something else as you may end up with ambiguous curves that 
have multiple output values for single input value.

http://www.w3.org/TR/css3-animations/#animation-timing-function

-- 
Andrew Fedoniouk.

http://terrainformatica.com
Received on Thursday, 9 April 2009 02:51:32 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Tuesday, 22 May 2012 03:46:58 GMT