0

Tengo un problema y es que he creado unas cards a las las cuales le he agregado unas animaciones al hacer scroll pero solo funciona en una de ellas ya que tienen la misma clase en html

    let card = document.querySelector(".card")
    let cardPosition = card.getBoundingClientRect().top;
let tamanoDepantalla = window.innerHeight*0.70;
if (cardPosition < tamanoDepantalla) card.style.animation =  "card-animation 3s "; 

}      ) `

1 respuesta 1

0

el querySelector solo toma el primer elemento con la clase que le pasas, debrias usar el querySelectorAll y recorrer el arreglo, algo asi:

let cards = document.querySelectorAll(".card")
for (const card in cards) {
  let cardPosition = card.getBoundingClientRect().top;
  let tamanoDepantalla = window.innerHeight*0.70;
  if (cardPosition < tamanoDepantalla) card.style.animation =  "card-animation 3s ";

y todo eso dentro de un EventListener

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.