Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Utilizando o transform / from > to

Estou com duas pequenas dúvidas:

Primeiro, resolvi este exercício com um código diferente, mas consegui um efeito bem similar, no caso ao invés de deixar a posição do elemento relativa, e mudar o "top" do elemento, eu usei o transform:

@keyframes flutua{
    0%{
        transform: rotate(-2deg) skew(-10deg) translateY(-0.1em);
    }
    100% {
        transform: rotate(-2deg) skew(-10deg) translateY(+0.1em);
    }
}

a pergunta é: Isto atrapalha meu CSS de alguma maneira? percebi que ele fica mais verboso, mas tenho alguma perda em desempenho por exemplo?

a segunda dúvida também é relacionada ao código postado: utilizei o 0% como ponto de partida e o 100% como ponto final, mas o exercício usa uma semântica diferente, com "from" e "to", isso faz alguma diferença para animações de 2 estágios?

1 resposta
solução!

Olá, Phelipe! Tudo certo? =)

Respondendo sua primeira pergunta, bem direto: Não, não há perda de desempenho. =)

A segunda dúvida, se sua animação possui apenas um estado inicial e final, você pode utilizar o from e to sem problemas, mas caso tenha estados intermediários, essa implementação fica inválida. =)

Espero ter ajudado, mas qualquer dúvida, não deixe de postar para podermos ajudá-lo!

Abraço e bons estudos,

Fábio