animate.css -div在动画后消失

Question

我正在使用waypoint.js和animate.css来使div动画化，并且可以工作，但是对于某些动画（例如flipInX和zoomIn），div动画会消失。但是对于某些其他情况（例如fadeIn，bounceIn），不会发生，并且div在fadeIn或bounceIn效果之后显示。我们是否必须对某些动画使用额外的类（例如它们如何在animate.css中使用infintie，delay，speed）？我查阅了文档，但找不到任何类上面的情况）

我的代码：

<script>
        $(document).ready(function () {

            // hide our element on page load
            $('#Site02').css('opacity', 0);
            $('#Site01').css('opacity', 0);
            $('#Site03').css('opacity', 0);

            $('#Site02').waypoint(function () {
                $('#Site02').addClass('zoomIn');
            }, { offset: '210%' });

            $('#Site01').waypoint(function () {
                $('#Site01').addClass('zoomIn');
            }, { offset: '210%' });

            $('#Site03').waypoint(function () {
                $('#Site03').addClass('zoomIn');
            }, { offset: '210%' });

        });
    </script>

<div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 animated fadeInUp">
                <div id="Site01" class="animated">Content</div>
                <div id="Site02" class="animated">Content</div>
                <div id="Site03" class="animated">Content</div>
  </div>
                           

有人可以指导我我要去哪里哪里