javascript - wow.js 的问题

Question

所以尝试结合使用 wow.js 和 animate.css

我的动画 css 工作正常，并且 wow.js 已包含并激活，但它没有注册我向下滚动到元素，因此没有动画。

我在标签之前在 html 底部包含的内容 + animate.css 库导入到我的 main.css

<script src="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js"></script>
<script>
  new WOW().init();
</script>

视口

  <meta name="viewport" content="width=device-width, initial-scale=1">

main.js - 应该与 wow.js 无关

$(document).ready(function() {

    console.log('Document ready');

    $('.fa-bars').click(function() {
        $('.nav__links').toggleClass('menu-appear');
    });

    $('.nav .nav__links a').click(function() {
        $('.nav__links').toggleClass('menu-appear');
    });

});

animate 已导入到我的 main.css 文件中。

完全难倒为什么这不起作用。任何想法，测试站点链接如下。

http://loved-shrew.cloudvent.net

Answer 1

在您的 CSS 中，删除overflow: hidden;似乎可以使其正常工作。我只通过在 chrome devtools 中取消选中此属性进行了测试。

@media (min-width: 1200px)
7690b3e….css:7
html {
    /* overflow: hidden; */
    height: 100%;
}