为什么 WOW.js 不工作并留下不可见的元素？答案

【问题标题】：Why is WOW.js not working and leaving invisible elements behind?为什么 WOW.js 不工作并留下不可见的元素？
【发布时间】：2019-08-09 21:15:59
【问题描述】：

我在本地电脑上有一个网站并将其链接到 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 页面下载了所有这些文件

网站/主机不好，而且没有照片，因为它们对于我使用的免费主机来说太大 (>1MB)。此外，一旦我上传了 javascript，它就无法正常工作。但这不是这个问题的重点。代码仍然存在，所以希望这已经足够好了。谢谢！

【问题讨论】：

你能提供一个实时链接吗？或在JSBIN 创建一个新的BIN
@UmairShahYousafzai 当然。在这里：stackoverflowproblems.site88.net/index.html 它不是最好的网站/主机，而且大多数照片都太大而无法上传。但是代码就在那里。
@UmairShahYousafzai 运气好吗？顺便说一句，动画应该是关于“Lorem Ipsum”的标志

【解决方案1】：

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

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

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

【讨论】：

【解决方案2】：

不要在您的 CSS 或样式中添加 overflow-x: hidden;。如果您的样式中有overflow-x: hidden;，它将不起作用。

【讨论】：