javascript - wow.js 的问题

Question

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

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

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

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

视口(viewport)

  <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%;
}