Re: transitions vs. animations

On Mon, Apr 5, 2010 at 1:44 PM, Håkon Wium Lie <howcome@opera.com> wrote:
> Tab Atkins Jr. wrote:
>
>  > > .button {
>  > >    color: blue;
>  > > }
>  > >
>  > > .button:hover {
>  > >   color: red;
>  > >   effect: on-entry change(color, 1s), on-exit change(color, 1s);
>  > > }
>  > >
>  > > .button:focus {
>  > >   color: green;
>  > >   effect: on-entry change(color, 1s), on-exit change(color, 1s);
>  > > }
>  > >
>  > > So, the button will start off being blue. Let's say the element first
>  > > is hovered (and turns red), and then is focused (and turns green).
>  > > This is given by the normal cascading rules in CSS.
>  >
>  > That's a lot of repetition, and it still doesn't cover all cases
>  > (.button[disabled] turning color:gray?).  All I want to have to do is
>  > say "Hey, you, button.  Always transition your color.".  Your proposal
>  > would require me to specify an on-entry and on-exit for *every single
>  > state* that changes the color of the button.  Transitions handle that
>  > use-case with a single simple property on ".button".
>
> The same will work in this proposal:
>
>  .button {
>     effect: on-entry change(color, 1s), on-exit change(color, 1s);
>  }

That doesn't seem to work.  At no point are you exitting the .button
"state".  When you match .button:hover, you still match .button.

If there is a more complex notion of state entry and exit going on
here, it must have flown by me.  ^_^

> I agree with you that we need to look at common use cases and compare
> syntax.

Cool.  What did you think of my breakdown of use-cases?  Do you see
any additional ones?  Anything that should be broken apart or
reorganized?

~TJ

Received on Monday, 5 April 2010 20:48:20 UTC