Método Window requestAnimationFrame()

Objeto Janela do JavaScript

requestAnimationFrame()O método informa ao navegador que você deseja executar uma animação, e solicita ao navegador que chame a função especificada para atualizar a animação antes da próxima redesena.

Este método passa o callback como parâmetro a ser chamado antes da redesenhar.

Sintaxe:

window.requestAnimationFrame(callback)

var start = null;
var element = document.getElementById('anim');
function step(timestamp) {
　　se (!start) start = timestamp;
　　var progress = timestamp　-　start;
　　element.style.transform = 'translateX('　+　Math.min(progress　/　10,　400)　+　'px)';
　　se progresso <　20000)　{
　　　　　window.requestAnimationFrame(step);
　　}
}
window.requestAnimationFrame(step);

Compatibilidade do Navegador

Os números na tabela especificam a primeira versão do navegador que suporta completamente o método requestAnimationFrame():

Valor do Parâmetro

Detalhes Técnicos

Referências Relacionadas

Tutoriais CSS:Animação CSS

Referência CSS:Atributo da Animação CSS

Referência CSS:Animação CSS-Atributo Atraso da Animação CSS

Referência CSS:Atributo Direção da Animação CSS

Referência CSS:Atributo Duração da Animação CSS

Referência CSS:Animação CSS-Fill-Atributo mode

Referência CSS:Animação CSS-Iteration-Atributo count

Referência CSS:Animação CSS-Atributo name

Referência CSS:Animação CSS-Reproduzir-Atributo state

Referência CSS:Animação CSS-Tempo-Atributo function

Objeto Janela do JavaScript