Exemplo
Espere dois segundos, em seguida, iniciar a animação:
div {
-webkit-animation-delay: 2s; /* Chrome, Safari, Opera */
animation-delay: 2s;
} Tente você mesmo " Mais "Try it Yourself" exemplos abaixo.
Definição e Uso
A propriedade de animação-delay especifica um atraso para o início de uma animação.
O valor-animação de atraso é definido em segundos (s) ou milésimos de segundo (ms) .
| Valor padrão: | 0s |
|---|---|
| Herdado: | no |
| Animatable: | no. Read about animatable |
| Versão: | CSS3 |
| sintaxe JavaScript: | object .style.animationDelay="1s" Try it |
Suporte a navegadores
Os números na tabela especificar a primeira versão do browser que suporta totalmente a propriedade.
Números seguido por -webkit-, -moz-, ou O- especificar a primeira versão que trabalhou com um prefixo.
| Propriedade | |||||
|---|---|---|---|---|---|
| animation-delay | 43,0 4.0 -webkit- | 10.0 | 16,0 5.0 -moz- | 9 4.0 -webkit- | 30,0 15,0 -webkit- 12,0 -o- |
CSS Syntax
animation-delay:time|initial|inherit;Valores de propriedade
| Valor | Descrição | Jogue |
|---|---|---|
| time | Opcional. Define o número de segundos (s) ou milissegundos (ms) a aguardar antes de a animação vai começar. O valor padrão é 0. Os valores negativos são permitidos | Jogue " |
| initial | Define essa propriedade para o valor padrão. Leia sobre inicial | |
| inherit | Herda essa propriedade do seu elemento pai. Leia sobre herdar |
mais Exemplos
Exemplo
Usando valores negativos, observe que a animação começa 2 segundos para o ciclo de animação:
div {
-webkit-animation-delay: -2s; /* Chrome, Safari, Opera */
animation-delay: -2s;
}
Tente você mesmo " Páginas relacionadas
Tutorial CSS3: CSS3 animações
HTML DOM de referência: animationDelay property