javascript - 为什么 WOW.js 无法工作并留下不可见元素？

Question

我的本​​地电脑上有一个网站，并将其链接到 wow.min.js。 (我不知道是否应该下载整个库或只下载该文件；我两种方法都做了，但仍然没有成功。)我尝试过:

下载整个库后:

<script src="WOW-master/dist/wow.min.js"></script>

仅此文件位于同一目录中:

<script src="WOW-master/dist/wow.min.js"></script>

使用此 CDN:

<script src="//cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js">

其中任何一个都不走运^ 对于所有这些变体，我将其用作 WOW 集成:

<script>new WOW().init();</script>

这将是目标元素:

<i class="fa fa-pencil-square-o fa-3x wow slideInLeft" id="icons" aria-hidden="true"></i>

我知道 animate.css 工作正常，因为如果我像这样编写上面的代码:

<i class="fa fa-pencil-square-o fa-3x animate infinite slideInLeft" id="icons" aria-hidden="true"></i>

我看到动画无限地工作。

它不会在滚动到时触发，而是使元素不可见(可见性:隐藏？)，并且您根本看不到目标元素。

可能是什么问题？

我从 WOW 的官方 gitHub 页面下载了所有这些文件

该网站的实时链接如下: http://stackoverflowproblems.site88.net/index.html

错误的网站/主机，并且没有照片，因为它们对于我使用的免费主机来说太大(>1MB)。另外，我上传后 JavaScript 就无法工作。但这不是这个问题的重点。代码仍然存在，所以希望这足够好。谢谢!

Answer 1

我遇到了和你一样的问题，直到我回到我的CSS并注意到我给了body标签一个隐藏的overflow-x属性:

body, html {
    /* Some stuff here */
    overflow-x: hidden;
}

一旦我删除它，这个问题就解决了，动画又开始工作了，事实上，这是一个 known issue在 wowJS 库中。所以要解决这个问题，只需删除隐藏的overflow-x即可。