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

Re: Are CSS animations a done deal?

From: Lars Gunther <gunther@keryx.se>
Date: Thu, 08 Apr 2010 01:06:39 +0200
Message-ID: <4BBD0FFF.1030001@keryx.se>
To: www-style list <www-style@w3.org>
2010-04-07 18:22, Anne van Kesteren skrev:
> On Tue, 06 Apr 2010 20:58:27 +0200, Lars Gunther <gunther@keryx.se> wrote:
>> - focus/blur
>> - mouseover/mouseout (mouseenter/mouseleave would be a better fit, but
>> there is no universal support yet, though)
>> - mousedown/mouseup
>> - load/unload
>> Etc.
> You can do the same with class names and some script and then you don't
> have to learn key-value pairs in JSON. I don't see the point.

We have key value pairs in CSS already with 95 % identical syntax.

selector {
     foo: bar;
     zoo: car;

object = {
     "foo": "bar",
     "zoo": "car"

The JSON part is not very significant per se. Perhaps CSSOM can do the 
same thing.

The point is I want to do two things:

1. Programmatically alter keyframe properties.

2. Attach animations to events in a natural way.

>> - S5 presentations, where slides and bullet points animate.
>> - Prezi-style animated presentations.
>> - Image slideshows.
>> - Advertising (yes, that is where well see much of this being put to
>> use!)
>> - Notifications information sent from the server (EventSource and XHR)
>> - HTML5 details (yes, designers are going to want to control the effect)
>> - Various forms of menus.
> I don't see why this wouldn't work. You might need some script, but
> that's not a problem.

The thing is, for 99 % of all real world use cases, scripting will be 
required. Developers will rarely animate buttons on hover states. They 
are going to want some other object to be animated when they click a 

>> And of course:
>> - Switching between pages on a site. Why not animate the whole page?
> These seems somewhat fundamentally different and would require a
> separate solution regardless of how we go about things.

This has been possible in MSIE for ages:


I was basically just thinking about setting an animation to be run on 
the load event for document.body.

> Bespin is not really a good example of why <canvas> needs to be
> accessible. Bespin demonstrates how awful contenteditable="" is or how
> non-existent highlighting support is for e.g. <textarea>.

I agree wholeheartedly that especially contentedible is a complete mess. 
However Bespin is an example of how technologies will be used in ways 
their creators did not anticipate.

What's the harm in trying to anticipate how declarative animations are 
going to be used and cover some more bases?

>> We have seen examples of a Star Wars walker, done using
>> CSS-animations. The technique is powerful. Is it that hard to imagine
>> someone using it to convey information?
> No, but I'm not seeing your point.

If it's done with CSS only, there is no accessibility.

Lars Gunther
Received on Wednesday, 7 April 2010 23:07:11 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:07:45 UTC