滚动后如何激活 animate.css答案

【问题标题】：How to activate animate.css after scroll滚动后如何激活 animate.css
【发布时间】：2017-06-03 20:58:15
【问题描述】：

我正在使用 animate.css [https://daneden.github.io/animate.css/]，并且我在我的网页中的一些元素中添加了一些动画。但是有一个问题。动画在向下滚动到该部分之前立即完成并且已经结束。有没有办法在加载特定元素后添加动画类？

这样动画只会在用户滚动到该元素时可见。

【问题讨论】：

你能显示你的代码吗？哪个元素 img 或 iframe
我在
元素上使用我的代码。我没有插入代码，因为它很长，而且大部分与我的问题无关。但是，我的滑块后面有一个部分，我希望在其中发生动画。动画效果很好，但我希望在用户向下滚动到该区域时出现动画。 //编辑说代码太长，不能在这个框中发布，对不起。我希望我能够证明这种情况。
您应该监听滚动事件以在每次用户滚动鼠标时获取位置。如果该位置在您的元素范围内，请将您想要的类添加到该元素。可以查看这个michalsnik.github.io/aos
想到了这一点，但所有设备的距离并不相同，因此必须找到另一种方法来以某种方式定位特定的 div。

【解决方案1】：

我有个主意，也许可以帮到你你可以通过javascript添加动画元素当页面滚动到位时，js将此元素添加到网页中（所以，它会开始动画）

【讨论】：

我认为“Nathan Meunier”的想法添加动画类更好，您可以在目标元素上添加am="jump"之类的属性，然后使用js决定网页滚动到位，删除类并添加类跳转，所以当滚动到位时它会动画

【解决方案2】：

是的，您可以在事件发生后使用 Jquery/javascript 将动画类动态添加到您的元素中。如果您输入您的代码，我可能会为您提供更多帮助。编辑：例如，如果您想要在单击按钮时出现动画，您可以这样做：

$( "#target" ).click(function() {  $('#yourElement').animateCss('bounce'); });`

【讨论】：

谢谢，但不是很有帮助。你能说得更具体点吗？
您没有向我们展示一些代码，很难更具体。但是例如，如果您想要在单击按钮时制作动画，则可以执行 $( "#target" ).click(function() { // 然后在这里您可以使用 $('#yourElement') 制作动画。 animateCss('bounce'); });
<div class="small_single animated fadeInLeftBig small1"> <a href="img.jpg"><img src="img.jpg" alt="" /> <p>Web Development</p></a> </div> 我正在使用我的一些元素
好的，但是你想要什么？
我正在使用另外 9 个像这样的
，这些元素在页面上有点低。动画在页面加载时发生，而不是在用户向下滚动到该位置时发生。我希望动画在该特定区域可见时准确发生，这就是我不知道该怎么做的问题。

【解决方案3】：

新 WOW().init();

并调用类 class="wowbounceInUp"

【讨论】：