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

[CSS2 Animation] comma-separated values

From: Alan Gresley <alan@css-class.com>
Date: Sun, 30 Jan 2011 15:31:57 +1100
Message-ID: <4D44E9BD.10303@css-class.com>
To: CSS 3 W3C Group <www-style@w3.org>
Hello,

Reading the spec.

http://dev.w3.org/csswg/css3-animations/

I see in 3 (Keyframes) this text (emphases added).

   | The keyframe selector for a keyframe style rule consists of a
   | *comma-separated* list of percentage values or the keywords
   | ‘from’ or ‘to’.


Example II has.

@keyframes wobble {
     0% { left: 100px; }
     40% { left: 150px; }
     60% { left: 75px; }
     100% { left: 100px; }
}

I don't see any comma-separated values above but under example I is this.

    keyframe-selectors: [ 'from' | 'to' | PERCENTAGE ] [ ',' [ 'from' | 
'to' | PERCENTAGE ] ]*;


Does this mean that 'wobble, roll' is possible as seen below?

@keyframes wobble, roll {
     0% { left: 100px; }
     40% { left: 150px; }
     60% { left: 75px; }
     100% { left: 100px; }
}

If so, an example would be good.


The properties, 'animation-name', 'animation-duration', 
'animation-timing-function', 'animation-iteration-count', 
'animation-direction', 'animation-play-state', 'animation-delay', 
'animation-fill-mode', 'animation' (shorthand) all allow comma-separated 
values but none of the prose in each section specifies this.


I now somewhat follow this,

   none | forwards | backwards | both [, none | forwards | backwards | 
both]*

Which  has ','  indicating a comma-separated value, but this may not be 
understood by an author.


-- 
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
Received on Sunday, 30 January 2011 04:33:33 GMT

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