Keyframes e animações Flashcards
usamos os keyframes para que?
para definir as etapas de uma animação
o que faz o animation-interation-count?
define quantas vezes a animação vai se repetir
o que faz o animation-play-state?
controla se uma animação está rodando ou pausada
o que faz o animation-direction?
controla o sentido da animação (reverse, alternate, alternate-reverse)
o que faz o animation-fill-mode?
controla o que acontece com o elemento antes e depois da animação( é recomendado sempre usar o both)
o que faz o animation-name?
tem que colocar o nome da animação que tu colocou no keyframes
o que fazer se quiser ver a animação em 3D?
todas as etapas no keyframes terão que estar com o rotateY e rotateX
o que deve ter em cima do animation por recomendação?
@media (prefers-reduced-motion: no-preference)
o que fazer quando quiser fazer a sombra de algo pulando ?
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