Re: Repeat animation-delay throughout iterations

On Fri, Jul 10, 2015 at 8:53 PM, Michiel Bijl <michiel@agosto.nl> wrote:

>
> Something I run into quite a lot as I build animations, is that
> animation-delay doesn't persist throughout iterations.
>
> Take the following code:
>
> div {
>   animation: unicorns linear infinite forwards 5s 3s;
> }
>
> On the first iteration it would wait 3 seconds before it starts, then it
> plays for 5 seconds. On consecutive plays it will loop the 5 second part
> but skip the delay. This is certainly useful in certain cases, but there
> are also cases where you want the delay to persist; kind of like
> `animation-fill-mode: forwards;`.
>
> I propose a second argument for the `animation-delay` property: repeat.
>
> div {
>   animation-delay: 3s repeat;
> }
>
> This will ensure that the delay is repeated on consecutive iterations.
> Alternatives to the repeat keyword are welcome, simply chose it because it
> is already in CSS vocabulary.
>

If you need something to be repeated every iteration, you just need to make
it part of the keyframes instead.

- Xidorn

Received on Friday, 10 July 2015 11:15:25 UTC