页面滚动时是否有任何用于元素入口动画的jQuery库？

Question

任何人都知道在页面滚动时输入动画的元素的好库。我使用了animate it库，它很棒，精简且易于处理但不能使用最新版本的jQuery（3.x）。 有人建议我一个很好的免费图书馆。

Answer 1

您可以使用Animate.css和Wow.js

Answer 2

您可以尝试动画滚动：

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

或者，如果您需要一个更高级的库，并且掌控更多，请尝试使用ScrollMagic：

http://scrollmagic.io/

Answer 3

您可以使用onscroll事件处理程序。

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

您将动画包含在.anime类中。

CSS

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

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

如果您需要动画在不滚动时停止，请参阅How do I know when I've stopped scrolling Javascript。