Javascript Jquery Visible不工作

当页面加载时，试图隐藏所有的.intro类div，但当滚动时，我希望它们淡入。我正在使用animate.css和jqueryvisible。我还尝试使用withinViewport.js、viewport.js和其他一些工具。我不能让它工作

<div class="section " id="section0" data-anchor="firstPage">
        <div class="intro">
            <h1>Navigation dots</h1>
            <p>An easy and beautiful way to navigate throw the sections</p><p>phone number</p>
        </div>
    </div>
    <div class="section" id="section1" data-anchor="secondPage">
            <div class="intro">
                <h1>Clickable</h1>
                <p>
                    You can even click on the navigation and jump directly to another section.
                </p>
            </div>
    </div>

---

请使用animate.css和wow.js，您可以根据需要添加任何动画类

wow=newwow(
{
boxClass:'哇'，//默认值
animateClass:'已设置动画'，//默认值
偏移量：0，//默认值
mobile:true，//默认值
live:true//default
}
)
wow.init（）
正文{
溢出-x:隐藏；/*用于动画*/
}
.介绍{
高度：500px；/*这只是一个示例*/
}

导航点
一种简单而漂亮的导航方式，可以通过电话号码浏览各个部分

可点击

您甚至可以单击导航并直接跳到另一个部分。

可点击

您甚至可以单击导航并直接跳到另一个部分。

可点击

您甚至可以单击导航并直接跳到另一个部分。

要添加动画效果吗…？如果有多个元素具有相同的类，则需要对每个语句使用。是，启用文本动画，但仅当特定部分位于视口内时才启用。这是您要查找的吗？我有多个“.intro”课程。我希望在加载页面时隐藏它们，但一旦进入视口，就会显示一个特定的“.intro”类。不要将它们全部设置为可见。
jQuery(document).ready(function() {

    $('.section').addClass("hidden");
    if( $('.section').hasClass('active') ) {
        $('.section').removeClass('hidden');
        $('.section').addClass('visible animated fadeIn');
    }

});   

$(window).scroll(function(){

    if( $('.section').hasClass('active'); ) {
        $('.section').removeClass('hidden');
        $('.section').addClass('visible animated fadeIn');
    }
    if( $('#section1').first().visible() ) {
        $('#section1').children().addClass('visible animated fadeIn');
    }

}    );