attivare Animate.css allo scroll della pagina

[giannino1995]

Ciao a tutti,

Ho implementato questa libreria in un template:

https://daneden.github.io/animate.css/

Per evitare di mettere mano al codice HTML ogni volta che desidero cambiare effetto uso questo script:

<script>
$(document).ready(function(){
$('.element-animate').addClass('animated fadeInUp');
});
</script>

Mi piace molto Animate.css, non so se esistono librerie più comode e funzionali da usare, se esistono sono lieto di sperimentarle. Animate.css funziona sempre, su qualunque browser di qualunque device e questo mi rincuora.
L'unica cosa che non riesco a fare e spezzettare l'effetto di questa libreria sui diversi tag della pagina.
Io vorrei che l'effetto si manifestasse solo quando il l'utente visualizza la section in cui il div con la classe è presente.
Con lo script sopra tutti i div con .element-animate ricevono l'effetto descritto da 'animated fadeInUp' così l'utente vede questa cosa carina solo per il div più vicino al menu in alto.

So che si può fare questa cosa perché in passato ho visto dei siti con queste funzionalità.