以某种方式过早地使用animate.css点火的js-waypoints

Question

亲爱的stackoverflowers，

某种程度上，我的路点会在页面加载时触发，而不是在它们应该触发时触发。 我的航点的目标是，当它在视口中并且距离顶部90％时它应该触发。然后它应该删除类'hidden'和'animate fadeInUp'（使用animate.css）。

任何有解决方案想法的人？

---

以下是滚动到视口时应触发的HTML以及远离顶部的90％

<div class="row hidden" id="waypoint">

这是我正在使用的javascript，但目前在页面加载后会自动触发。

<script type="text/javascript">
$('#waypoint').waypoint(function() {
    $("#waypoint").removeClass("hidden");
    $("#waypoint").addClass("animated fadeInUp");
}, {
offset: '90%'
});
</script> 

这里是JS-Plugin和animate.css的链接，我正在使用。

http://imakewebthings.com/jquery-waypoints/

http://daneden.me/animate/

---

感谢能够解决这个小谜团的人。

Answer 1

包裹它：

$(document).ready(function() {

$('#waypoint').waypoint(function() {
$("#waypoint").removeClass("hidden");
$("#waypoint").addClass("animated fadeInUp");
}, {
offset: '90%'
});

});