HTML | CSS | Semantic Tags | Animations

Community feedback

• 

  Matheus Fernandes•340

  @xtirianPosted over 1 year ago

  Hello, my friend. Hope you are doing well.

  I saw that you use the overflow: hidden in the body when i'm sure you wanted use overflow-x: hidden

  Also, how you did the animations? It work jut with the delay?

  I didn't find any js file in your code.

  Marked as helpful

  0

  ---

  

  Diogo•100

  @diogo-kappaunPosted over 1 year ago

  @xtirian E ai mano, de boa e voce? Realmente o hidden era para ser somente no eixo x, tenho que alterar.

  Então as animações são feitas da seguinte forma:

  -> .courses-view .courses { --delay: 0.6s; animation: appear 1s var(--delay) backwards ease-in-out; } (Isso vai dentro de cada card) -> No HTML eu coloco um style-inline em cada card alterando o valor da variavel --delay.

  Por exemplo: <div class="courses" style="--delay: 0.9s"> <div class="courses" style="--delay: 1.2s"> <div class="courses" style="--delay: 1.5s"> (cada div é um card diferente)

  -> Como na animação o delay é puxado a partir da variavel, cada card tem seu proprio delay.

  Espero que consiga entender, obrigado pelo comentario!

  Ja fiz as alterações, vi agora que tinha tirado o scroll kkkk

  1