javascript - 如何仅在滚动到元素时将 Animate.css 效果应用于该元素？

Question

我正在使用 animate.css 库在我的网站上应用动画效果。但问题是效果会在页面加载后立即应用。当我滚动到元素时，效果已经应用。如何设置仅在滚动时出现元素时才应用效果？

Answer 1

您可以使用 Waypoints – 一个 javascript 库，它允许您在滚动到某个元素时执行一个函数。

jQuery 中的基本 Waypoint 函数如下所示:

$("#element-to-animate").waypoint(function() {
    // animation code
  }
}, { offset: '100%'});

“offset”值决定了动画被触发的时间点。 Here是设置和使用航路点的指南。