Quiero agregar una animación "perezosa" para una sección de un sitio, y hacer que desaparezca de la vista cuando se desplace más allá. He intentado buscar en silencio algunas opciones diferentes, pero nada parece mantenerse. También tengo una clase con otra subclase para ahorrarme código css a la larga ya que el sitio tiene varias secciones.

Hasta ahora, si puedo descubrir cómo verificar la ventana gráfica en relación con este elemento y cómo hacer que un valor vuelva a ser verdadero cuando lo es, simplemente puedo activar una clase para aplicar con la animación adjunta.

He estado lanzando algo de Vanilla JS ya que no estoy muy familiarizado con Jquery, pero aquí está la prueba con la que he estado tratando de jugar.

 ` <div class="content"> <h1>test </h1> </div> <div class="content one"> <h1>test 1</h1> </div> `

Entonces, el contenido se deja solo y el .content.one específico es el que tiene la clase agregada.