Keyframes e animações Flashcards

1
Q

usamos os keyframes para que?

A

para definir as etapas de uma animação

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

o que faz o animation-interation-count?

A

define quantas vezes a animação vai se repetir

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

o que faz o animation-play-state?

A

controla se uma animação está rodando ou pausada

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

o que faz o animation-direction?

A

controla o sentido da animação (reverse, alternate, alternate-reverse)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

o que faz o animation-fill-mode?

A

controla o que acontece com o elemento antes e depois da animação( é recomendado sempre usar o both)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

o que faz o animation-name?

A

tem que colocar o nome da animação que tu colocou no keyframes

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

o que fazer se quiser ver a animação em 3D?

A

todas as etapas no keyframes terão que estar com o rotateY e rotateX

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

o que deve ter em cima do animation por recomendação?

A

@media (prefers-reduced-motion: no-preference)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

o que fazer quando quiser fazer a sombra de algo pulando ?

A

tem que colocar o box-shadow em todas as etapas no keyframes e em todas as etapas em que o elemente estiver em cima, o tanto que foi colocado no translate pra ele subir tem que ser adicionado na sombra de baixo do elemente pra sombra continuar em baixo

How well did you know this?
1
Not at all
2
3
4
5
Perfectly