Animation

Baseline 2022

Newly available

Since September 2022, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Experimental: Esta é uma tecnologia experimental
Verifique a tabela de compatibilidade entre Navegadores cuidadosamente antes de usar essa funcionalidade em produção.

A interface Animation da Web Animations API representa um único player de animação e fornece controles e uma linha do tempo (timeline) para um nó de animação ou recurso.

Construtor

Animation(): Cria uma nova instância do objeto Animation.

Propriedades

Animation.currentTime: O valor do tempo atual da animação, em milissegundos, esteja ela executando ou pausada. Se a animação não tem uma timeline, está inativa ou ainda não foi executada, este valor é null.
Animation.effect: Obtém e define o KeyframeEffect associado a essa animação.
Animation.finished Somente leitura: Retorna a Primise de finalização atual para essa animação.
Animation.id: Obtém e define a String usada para identificar a animação.
Animation.oncancel: Obtém e define o manipulador para o evento cancel.
Animation.onfinish: Obtém e define o manipulador para o evento finish.
Animation.playState Somente leitura: Retorna um valor enumerado descrevendo o estado de execução de uma animação.
Animation.playbackRate: Obtém ou define a taxa de execução da animação.
Animation.ready Somente leitura: Retorna a promessa atual para quando essa animação estiver pronta.
Animation.startTime: Obtém ou define o tempo agendado quando a execução de uma animação deve começar.
Animation.timeline: Obtém ou define a timeline associada a essa animação.

Métodos

Animation.cancel(): Limpa todos os keyframeEffects causados por essa animação e aborta sua execução.
Animation.finish(): Vai até um dos extremos dessa animação, dependendo se ela está executando ou retornando.
Animation.pause(): Suspende a execução de uma animação.
Animation.play(): Inicia ou continua a execução de uma animação ou a recomeça se ela tiver terminado anteriormente.
Animation.reverse(): Move a animação ao contrário, parando no início da animação.

Especificações

Specification
Web Animations # the-animation-interface

Compatibilidade com navegadores

BCD tables only load in the browser