wow.js 和 animate.css 不适用于 wordpress 主题

Question

我在 body 的末尾添加了 wow.min.js 并初始化了 WOW，在 header 的末尾添加了 animate.css。但是在给元素添加类之后，动画并没有出现。

我尝试通过 function.php 添加 CSS 和 js 文件，但这也不起作用。

body:


<?php wp_footer();?>
<script src="<?php echo get_template_directory_uri() . '/js/wow.min.js' ?>"></script>
        <script>
     wow = new WOW();
        wow.init();
        </script>
</body>

header:

<head>
    <meta charset="<?php bloginfo('charset');?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="profile" href="https://gmpg.org/xfn/11">
  <link rel="stylesheet" href="<?php echo get_template_directory_uri() . '/assets/styles/header.css' ?>">
  <link rel="stylesheet" href="<?php echo get_template_directory_uri() . '/assets/styles/animate.min.css' ?>">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">

    <?php wp_head();?>
</head>

Answer 1

你好，卷毛。
你能检查一下 Jquery 是否也附加到模板吗？
我认为 wow.js 和动画 js 需要 Jquery.

<script src='https://code.jquery.com/jquery-3.6.0.min.js' id='jquery-core-js'></script>

如果有效请告诉...

Answer 2

在这个问题上花了 2 天时间后，我发现我应该添加 animate__animated 以及其他 class 名称来执行动画。我不知道这是否是 animate.css 上的新更新，但教程从未提及这一点。嵌入脚本一切正常。

wow.js 和 animate.css 不适用于 wordpress 主题

wow.js and animate.css doesn't work on wordpress theme

css

php

wordpress

animate.css

wow.js