W3C home > Mailing lists > Public > www-style@w3.org > March 2016

Re: [css-animations][web-animations] steps() timing function sometimes unintuitive

From: Brian Birtles <bbirtles@mozilla.com>
Date: Wed, 9 Mar 2016 08:08:02 +0900
To: Rachel Nabors <rachelnabors@gmail.com>, www-style list <www-style@w3.org>
Cc: "Tab Atkins Jr." <jackalmage@gmail.com>, "L. David Baron" <dbaron@dbaron.org>, "public-fx@w3.org" <public-fx@w3.org>
Message-ID: <56DF5B52.4050805@mozilla.com>
On 2016/03/09 7:24, Rachel Nabors wrote:
> I was thinking of "steps(5, equal)" when discussing this syntax, as an
> expansion of the steps() formula. I think it looks sensible, if that's
> possible?

Works for me.

"start" and "end" refer to where the step takes place, while "equal" 
doesn't but actually influence the length of each segment, so it's a bit 
odd. Still, I think it's ok.

If we can't find a suitable keyword to stick into steps(), then another 
option is to mint a completely separate function (e.g. stagger(), 
quantize() etc.).

> On Mon, Mar 7, 2016 at 9:00 PM Brian Birtles <bbirtles@mozilla.com
> <mailto:bbirtles@mozilla.com>> wrote:
>
>     On 2012/12/21 3:46, Tab Atkins Jr. wrote:
>      > On Wed, Dec 19, 2012 at 6:40 PM, L. David Baron
>     <dbaron@dbaron.org <mailto:dbaron@dbaron.org>> wrote:
>      >> On Wednesday 2012-12-19 10:29 -0800, Tab Atkins Jr. wrote:
>      >>> I propose another steps value: step-mid. It splits the
>     animation curve
>      >>> into n segments, makes the first n-1 do step-end behavior, and
>     leaves
>      >>> the last to just run normally.  The above example could instead be
>      >>> written as "steps(4, step-mid)" and have this behavior:
>      >>
>      >> I like the idea, but I find the name confusing; it sounded like
>      >> something that would give the first and last steps half the duration
>      >> of the other steps.  (I also find the description quoted above
>      >> confusing, but the rest of the email made it clear.)
>      >
>      > I have absolutely no attachment to the name.  It was the first thing
>      > that came to mind.
>      >
>      > I assume that Rachel's suggestion comes from her association of
>      > steps(n, end) with meaning "eat the end of the animation" (and
>      > likewise for "start"), so "none" is reasonable in that sense.
>     I'm not
>      > sure it makes sense if your understanding comes from the spec's
>      > explanation, though, where "end" means "transitions all at once
>     at the
>      > end of the step".
>      >
>      > Another possibility is just a new function.  I'm not sure what I'd
>      > want to name it, though.
>
>     I spoke with Rachel and a few others about this recently and we were
>     wondering about the name step-equal? Unfortunately, that doesn't
>     translate into a function very well ('step-equal(2)'? Alternatively,
>     what about 'step-stagger' and 'stagger(5)', or just the function?).
>
>     I'd like to settle on this soon because Chrome is shipping
>     Element.animate() with support for 'step-middle' as defined by Web
>     Animations.[1] We went to implement this in Firefox[2] but I'm concerned
>     that there aren't use cases for step-middle as currently specced and
>     instead what we want is what Tab originally proposed in this thread.
>
>     Assuming usage is low in Chrome, I'd like to drop step-middle from Web
>     Animations and replace it with this revised timing function.
>
>     Best regards,
>
>     Brian
>
>     [1] http://w3c.github.io/web-animations/#typedef-step-timing-function
>     I didn't realize Chrome had implemented this, or else I would have
>     brought this up sooner.
>     [2] https://bugzilla.mozilla.org/show_bug.cgi?id=1248340
>
Received on Tuesday, 8 March 2016 23:08:34 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:09:01 UTC