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

Re: [css3-animations] or?

From: Alan Gresley <alan@css-class.com>
Date: Sun, 24 Apr 2011 05:43:02 +1000
Message-ID: <4DB32BC6.8050709@css-class.com>
To: Rik Cabanier <cabanier@gmail.com>
CC: "Tab Atkins Jr." <jackalmage@gmail.com>, Andrew Fedoniouk <news@terrainformatica.com>, www-style@w3.org, Simon Fraser <smfr@me.com>
CC Simon Fraser

On 21/04/2011 2:48 PM, Alan Gresley wrote:
> On 20/04/2011 7:03 AM, Rik Cabanier wrote:
[snip]
>> Your proposal is about making the CSS easier to author, correct?
>> You can already create these long animations with very long keyframes
>> today...
>
>
> Yes, but what if you decide to change the length of the animation? Lets
> say from an original 50 seconds to 100 seconds. Just this change makes
> the animation twice as slow and what happened at 20% during the original
> length must now happen at 10% for the correct timing.
>
> You may want to keep the events that happened from 20% to 40% in the
> original animation (10 seconds) to still happen at the same range of 20%
> to 40% (now 20 seconds). If this was an indication of something speeding
> off into the distance by translation, you must now double the distance
> of this translation so the acceleration is the same.
[snip]


Here is a demo (view in Safari) which is the hardest CSS I have ever coded.


http://css-3d.org/flight-of-the-venturer.htm


Originally the animation was for 100 seconds. The first 20 seconds was 
good and the last 30 second was good but overall, the animation was to 
long. To avoid percentage craziness, I cut the animation to run for 50 
seconds.

Since I wanted to keep the first part and the last part of the animation 
the same, I simply changed these percentages.

   5%  -----> 10%
   10% -----> 20%
   15% -----> 30%
   20% -----> 40%

       and
   75% -----> 50%
   90% -----> 80%
   95% -----> 90%


The dilemma was what was from 20% to 75% (55 seconds) in the original 
100 second animation had to be shrunk into 40% to 50% (10 seconds) in 
the shorter 50 second animation (this is a somewhat simple explanation, 
it was awful and frustrating).

If I could do keyframes in seconds instead of percentages, I would only 
have to change the later parts by changing 100s to 50s and 75s to 25s.

The whole animation itself would work as one animation group. If I 
wanted to (no really), I could add another chapter. This I would much 
prefer to do by having another group. This second group of the animation 
would be easier to create by just commenting out the first group and 
starting the second group at zero seconds.

Time to rest my brain.


-- 
Alan Gresley
http://css-3d.org/
http://css-class.com/
Received on Saturday, 23 April 2011 19:43:34 GMT

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