attivare Animate.css allo scroll della pagina

[giannino1995]

ciao!

l'unica cosa che mi viene in mente è quella di attivare l'animazione quando la section diventa visibile all'utente.
non ho mai fatto una cosa del genere, ma qui mi sembra abbiamo posto lo stesso problema: https://stackoverflow.com/questions/...ecomes-visible

potresti provare.

Grazie mille, non conoscevo queste funzioni.
Ho provato a riscrivere il mio codice in questo modo:

    <!-- Script per attivare Animate.css allo scroll della pagina. -->    <script>
    // Script per attivare Animate.css.
    //$(document).ready(function(){
    //    $('.element-animate').addClass('animated fadeInUp');
    //});
    
    // Script per attivare Animate.css allo scroll della pagina.
    $(document).ready(function(){
        var options = {
            root: document.querySelector(".element-animate"),
            threshold: 1.0
        }
        var observer = new IntersectionObserver(callback, options);
        var target = document.querySelector(".element-animate");
        observer.observe(target);
        var callback = function(entries, observer) {
            entries.forEach(entry => {
                $('.element-animate').addClass('animated fadeInUp');
            });
        };
    });
    </script>

ma ho peggiorato la situazione perché le classi dei div non si aggiornano più:

...
<div class="col-md-7 col-sm-12 element-animate">
<h1 class="h1">Titolo</h1>
<i>testo</i>
<p>testo 2</p>
<p><a href="#" class="btn btn-primary">Contattaci</a></p>
</div>
...

Come risolvo?
Mi andrebbe bene anche una libreria...