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

Re: transitions vs. animations

From: Brad Kemper <brad.kemper@gmail.com>
Date: Mon, 5 Apr 2010 21:23:58 -0700
Cc: Chris Marrin <cmarrin@apple.com>, "www-style@w3.org list" <www-style@w3.org>
Message-Id: <54522571-6FB3-4B42-85D6-BA82334AA260@gmail.com>
To: "Tab Atkins Jr." <jackalmage@gmail.com>

On Apr 5, 2010, at 3:32 PM, Tab Atkins Jr. wrote:

> I don't see any reason why bouncing an element up and
> down as you slide it from left to right should be too advanced.  This
> would be the entire thing, in my proposed syntax:
> 
> @keyframes bounce {
>  from { top: 0; }
>  25% { top: 20px; }
>  50% { top: 0; }
>  75% { top: -20px; }
>  to { top: 0; }
> }
> 
> .slider {
>  left: 0;
>  transition: left 1s, play(left, bounce) 1s;
> }
> 
> .slider:hover {
>  left: 400px;
> }
> 
> Done!  

I think this has promise, and is very similar to what I had swimming around in my head after the f2f. But I don't think you need the second 'left' inside the function. I'm imagining the component property for that function as being something I'll call 'transition-side-effect-animation-that-plays-whenever-the-transition-takes-place' (although perhaps we can find a shorter name). Since It happens whenever the already specified 'transition-property' changes, then it doesn't need repeating inside the function.

Received on Tuesday, 6 April 2010 04:24:34 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:26 GMT