javascript - waypoint.js 在第二部分不起作用

Question

在我的代码中，我希望在滚动的每个部分上元素都可见，但这并没有发生。在第一部分中，它工作正常，但在第二部分中则不然，我实际上也在使用 fullpage.js。但除了第二部分的 waypoint.js 之外，一切都工作正常

$('.ianimator').waypoint(function() {
  $('.ianimator').addClass('animated fadeIn');   
},{offset:'90%'});

$('.secmator').waypoint(function() {
  $('.secmato').addClass('animated fadeIn');   
},{offset:'90%'});

DEMO

Answer 1

如果您阅读the fullPage.js FAQs您将意识到依赖滚动事件的库在 fullPage.js 中无法工作，除非您使用 fullPage.js 选项 scrollBar:true 或 autoScrolling:false。

我个人建议您使用fullPage.js state classes或callbacks来实现这些动画。这样您就可以使用任何 fullPage.js 配置。

Here's a video tutorial I made关于 css3 动画和 fullpage.js 状态类的使用。