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 文件中。

完全不知道为什么这不起作用。有什么想法，测试站点link如下

http://loved-shrew.cloudvent.net

Answer 1

在您的 CSS 中，删除 overflow: hidden; 似乎可以正常工作。我只是通过在 chrome devtools.

中取消选中此属性来进行测试

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

wow.js 的问题

Issues with wow.js

javascript

jquery

css

animate.css

wow.js