CSS Transitions Feedback

Hi,
   These are some issues I have found regarding Apple's proposed CSS 
Transitions spec [1].

Given a list of times for 'transition-duration' and a list of properties 
for 'transition-property', it is not defined which durations are applied 
to which properties.  It seems to be implied that the first duration 
aplies to the first property, the second duration to the second property 
and so forth.  But what is supposed to happen when the number of 
properties specified doesn't match the number of durations?

e.g.
transition-property: width, height, opacity;
transition-duration: 1s, 2s;

Based on experimenting with the WebKit implementation, it seems that the 
third property, opacity in this case, will have a duration of 1s.  (The 
same issue also applies to 'transition-delay')


The spec doesn't define what happens when 'transition-property' has the 
value 'all', and there is more than one duration specified.

e.g.
transition-property: all;
transition-duration: 1s, 5s, 2s;

The WebKit implementation seems to use the last duration specified for 
all transitions.  This doesn't seem particularly intuitive, as I 
expected it would be the first before I tested it. But, either way, it 
should be defined.


Does 'transition-property' support the use of shorthands properties, or 
will it be required to have each individual property listed separately?

(Although there is an issue mentioned in the spec that says "We need to 
generate a list of properties that can be transitioned.", some 
shorthands like 'border-width' are listed in the table in the Animatable 
properties section)

e.g. Is this:

transition-property: border-width;

equivalent to this:

transition-property: border-top-width, border-right-width, 
border-bottom-width, border-left-width;

If so, then what effect does that have on the values for 
'transition-duration' and 'transition-delay'?  (If shorthands aren't 
allowed, then this question isn't relevant)


The definition for the shorthand 'transition' property is ambiguous 
because it defines that the <transition-duration> and <transition-delay> 
values can be specified in any order, along with the 
<transition-property> and <transition-timing-function>.  However, since 
both are spefied as times, the only way to distinguish these properties 
is based on their order.  The WebKit implementation always treats the 
first number as the duration and the second as the delay.

[1] http://webkit.org/specs/CSSVisualEffects/CSSTransitions.html

-- 
Lachlan Hunt - Opera Software
http://lachy.id.au/
http://www.opera.com/

Received on Wednesday, 10 December 2008 13:29:20 UTC