Propriedade AnimationEvent elapsedTime
Exemplo
Descubra quantos segundos uma animação está em execução:
var x = document.getElementById("myDIV");
x.addEventListener("animationiteration", myRepeatFunction);
function myRepeatFunction(event) {
this.innerHTML = "Elapsed time: " + event.elapsedTime;
}
Definição e uso
A propriedade elapsedTime retorna o número de segundos que uma animação está em execução, quando ocorre um evento de animação.
Nota: O valor de retorno não é afetado se a animação for pausada (usando a propriedade CSS animation-delay).
Observação: para o evento animationstart , essa propriedade sempre retorna "0".
Esta propriedade é somente leitura.
Suporte ao navegador
Os números na tabela especificam a primeira versão do navegador que oferece suporte total à propriedade.
Property | |||||
---|---|---|---|---|---|
elapsedTime | Yes | 10.0 | 6.0 | Yes | Yes |
Sintaxe
event.elapsedTime
Detalhes técnicos
Valor de retorno: | Um número, representando o número de segundos que uma animação está em execução |
---|
Páginas relacionadas
Referência HTML DOM: o evento animationstart
Referência HTML DOM: o evento animationiteration
Referência HTML DOM: o evento animationend
Referência HTML DOM: propriedade AnimationEvent animationName
Referência CSS: propriedade de animação CSS3
Referência CSS: propriedade CSS3 animation-duration