javascript - jquery addclass 和 hasclass 与 animate.css

Question

我正在尝试使用 addclass 和 hasclass 为分区类添加 animate.css 动画。

<section class="main active">
 ...
</section>
<section class="aboutus">
    <h1>About Us</h1>
    <p class="aboutus-text">
    Text
    </p>
</section>

上面是我要制作动画的 HTML 代码。

因此当滚动到关于我们部分时，active 将从主要部分中删除并添加到关于我们部分。

当关于我们部分中存在事件时，我尝试使用它来检测和添加动画。

if($("section.aboutus").hasClass('active')) {
    $(".aboutus-text").addClass("animated fadeIn");
};

它不起作用。我试图通过删除 if 语句来查看 addClass 是否正常工作，'animated fadeIn' 被添加到 aboutus-text。

谁能告诉我该怎么做？因为我只希望动画在关于我们处于事件状态时开始。

Answer 1

插件有afterMove()回调，需要用到

$(".main").onepage_scroll({
    easing: "ease",
    animationTime: 1000,
    afterMove: function () {
        if ($("section.aboutus").hasClass('active')) {
            $(".aboutus-text").addClass("animated fadeIn");
            $("section.aboutus").css({
                'display': 'block'
            });
        };
    }
});