Django 网站 wow.js 和 animate.css 不工作答案

【问题标题】：Django website wow.js and animate.css is not workingDjango 网站 wow.js 和 animate.css 不工作
【发布时间】：2020-06-19 18:04:28
【问题描述】：

我让 animate.css 可以正常工作，但是当我将 wow.js 导入我的静态文件夹时，它在滚动条上或一般情况下都不起作用。动画部分仅在没有“哇”类的情况下有效。
由于我的网站是用 django 构建的，我不确定这是否与它有关。这是包含动画和 wow 文件的代码。

<link rel="stylesheet" href="{% static 'css/animate.css' %}">

这是唯一有效的：

<div class="container">
    <h1 class="animate__animated animate__bounce" style="color:black;">An animated element</h1>

所有这些都不起作用，我不知道我做错了什么：

    </div>
    <div class="container">
    <h1 class="wow animate__bounce" style="color:black;">An animated element</h1>
    </div>
    <div class="container">
    <h1 class="wow bounce" style="color:black;">An animated element</h1>
    </div>
    <div class="wow bounce">
    <h1 class="wow bounce" style="color:black;">An animated element</h1> 
    </div>

I have these loaded in as well:

    <script language="javascript" type="text/javascript" src="{% static 'js/wow.min.js' %}"></script>
    <script>new WOW().init();</script>

Attached image of my folder hierarchy

wow.js 在我将容器放在页面上的任何地方都不起作用。所有这些代码都在我的 base.html 文件夹中（请参考附图）

这是我的控制台日志：

[19/Jun/2020 17:46:10] "GET /favicon.ico HTTP/1.1" 404 4547
[19/Jun/2020 17:46:20] "GET / HTTP/1.1" 200 7917
[19/Jun/2020 17:46:20] "GET /static/css/master.css HTTP/1.1" 200 
1631
[19/Jun/2020 17:46:20] "GET /static/css/animate.css HTTP/1.1" 200 
95376
[19/Jun/2020 17:46:20] "GET /static/css/blog.css HTTP/1.1" 200 506
[19/Jun/2020 17:46:20] "GET /static/js/wow.min.js HTTP/1.1" 200 8155
[19/Jun/2020 17:46:20] "GET /media/blog_pic/markus-spiske- 
qjnAnF0jIGk-unsplash.jpg HTTP/1.1" 200 634265
[19/Jun/2020 17:46:20] "GET /media/blog_pic/IMG_4779_1s6meGH.jpg 
HTTP/1.1" 200 829413
[19/Jun/2020 17:46:20] "GET /media/blog_pic/kelly-sikkema- 
lJrTJHzQjOs-unsplash.jpg HTTP/1.1" 200 162152
[19/Jun/2020 17:46:20] "GET /static/pictures/linkedin-logo.png 
HTTP/1.1" 200 3346
Not Found: /favicon.ico
[19/Jun/2020 17:46:21] "GET /favicon.ico HTTP/1.1" 404 4547

在我的网站上，它们还包含其他信息（我没有包括，因为它在这个线程上太乱了），但当“哇”类是否在其中时，它们甚至没有动画。
如果有人可以提供帮助，请告诉我。谢谢

【问题讨论】：

如果wow.min.js的get response是200，你能从控制台日志中确认吗？
我已将其附加到问题中。它似乎得到了 200 是的。

标签： html django css-animations animate.css wow.js

【解决方案1】：

我无法使用 CDN 版本，直到我在 YouTube 上看到了一个最近的视频。

解决方法是下载 wow master 并将其解压到项目的静态文件夹中。

<!-- CSS -->
<!-- Animate  local static CSS -->
<link rel="stylesheet" href="{% static 'WOW-master/css/libs/animate.css' %}" >

<!-- JS -->
<!-- LOCAL STATIC WOW JS -->
<script src="{% static 'WOW-master/dist/wow.min.js' %}" ></script>

这对我有用，至少现在是这样。

YouTube 视频：https://www.youtube.com/watch?v=fM1WKHW7k8I&feature=youtu.be

【讨论】：

谢谢！我会试一试的。

【解决方案2】：

我之前遇到过这个问题，实际上是浏览器的问题。

通过将 google chrome 更改为面向开发人员的 google chrome 解决。

尝试为开发者下载新的浏览器。

“永远不要同时打开两个浏览器”Gunter O'dimm

【讨论】：