Re: CSS Transitions Feedback

[apologies if this breaks threading]

On Wed, 10 Dec 2008, Lachlan Hunt wrote:

 >    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 property values repeat, so your example could be rewritten as:

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

I'll add this to the specification.

 > 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.

Agreed. And I also think it should be the first.

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

Originally we had intended shorthand properties to be excluded, but a
few people have asked for it, and it will make life easier for authors.

I'll add to the specification to say that shorthand properties should
be supported.

 > > (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)

Exactly! Most authors (me included) probably do not all the properties
that are shorthands.

 > > 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.

Yes. This should be clarified that the order is important for the  
duration
and delay.

Dean

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

Received on Thursday, 8 January 2009 01:44:56 UTC