Animation.currentTime
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since março de 2020.
Experimental: Esta é uma tecnologia experimental
Verifique a tabela de compatibilidade entre Navegadores cuidadosamente antes de usar essa funcionalidade em produção.
A propriedade Animation.currentTime da Web Animations API retorna e altera o tempo atual da animação em milésimos de segundos, seja estando em execução ou pausada.
Se a animação não tem uma timeline, está inativa, ou ainda não foi colocada em execução, o valor de retorno do currentTime será null.
Sintaxe
vartempoAtual = Animation.currentTime; Animation.currentTime = novoTempo;
Valor
Um número que representará no tempo atual da animação em milésimos de segundos, ou null para desativar a animação.
Examples
No jogo Drink Me/Eat Me, O tamanho da Alice é animado e pode crescer ou diminuir. No início do jogo, o tamanho dela foi colocado entre os dois extremos do animation's currentTime no meio do KeyframeEffect's duration, desta maneira:
aliceChange.currentTime = aliceChange.effect.timing.duration / 2;
Outra forma mais genérica para encontrar o marco de 50% da animação pode ser feito da seguinte forma:
animation.currentTime =
animation.effect.getComputedTiming().delay +
animation.effect.getComputedTiming().activeDuration / 2;
Especificações
| Specification |
|---|
| Web Animations # dom-animation-currenttime |
Compatibilidade com navegadores
Loading…
Veja também
Animationpara outros métodos e propriedades que você pode usar para controlar a animação da página web.Animation.startTimepara o tempo que a animação está programada começar.- Web Animations API