Is there any jQuery library for elements entrance animation while page scroll?

Question

Any one know a good library for elements entering animation while page scrolling. I have used animate it library, its awesome, lite and easy to handle but not working with newest version of jQuery(3.x). Somebody suggest me a good free library.

Answer 1

you can use Animate.css and Wow.js

Answer 2

You may try animate-on-scroll:

https://michalsnik.github.io/aos/

Or if you need a more advanced library with lot more control in your hands, try ScrollMagic:

http://scrollmagic.io/

Answer 3

You could use the onscroll event handler.

window.onscroll - function() {
    var el = document.getElementById('animateMe');
    el.addClass('anime');
}

where you have the animation included in the .anime class.

CSS

.anime { 
    animation: yourAnimation 2s ease-out;
}

@keyframes animation { 
    0% {
        background: blue;
    }
    100% { 
        backgroudn: red;
    }
}

If you need the animation to stop when not scrolling, see How do I know when I've stopped scrolling Javascript.