文章/答案/技术大牛

发布

社区首页 >问答首页 >为什么anime.js不能工作？

问为什么anime.js不能工作？
EN

Stack Overflow用户

提问于 2017-05-17 14:06:46

回答 1查看 7K关注 0票数 1

我正试图将anime.js加载到我的网站上，但它不起作用。我已经下载了.ZIP，并正确地将它放置在一个名为/js/和引用的子文件夹中。我甚至可以在Chrome的检查中查看源代码中的anime.min.js文件。

  <body>
    <div class="container">
    <div class="section center">
      <h1 class="title"></h1>      
          <section>
                <div class="purple"></div>
                <div class="darkgreen"></div>
                <div class="darkred"></div>
            </div>
          </div>
          </section>      
      </div>
    </div>
  <footer class="center">


    <p>CREATED BY HARRY BENDIX-LEWIS | 2017</p>
      </footer>
      <script src="js/anime.min.js" type="text/javascript">
      window.onload = function() {
      anime({
      targets: ['.purple', '.darkgreen', '.darkred'],
      rotate: 360,
      borderRadius: '50%',
      duration: 3000,
      loop: true
    });
    }
      </script>
    </body>

我也有：

<script src="js/anime.min.js"></script>

在我脑子里。

编辑:忘记了我的CSS

div {
    height: 50px;
  width: 50px;
    margin: 10px;
}

.purple {
    background-color: purple;
}

.darkgreen {
    background-color: darkgreen;
}

.darkred {
    background-color: darkred;
}

这对我来说是没有意义的，为什么动画不能工作。我从CodePen上的一个示例页面获取了这段代码。

javascript

animation

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-05-17 14:09:33

您将在自己的代码中同时加载脚本，因为您使用的是相同的标记。您必须确保在您的代码或动画未定义之前读取anime.min.js。将它放在两个独立的脚本元素中：

<script src="js/anime.min.js" type="text/javascript"></script>
<script type="text/javascript">
    window.onload = function() {
        anime({
            targets: ['.purple', '.darkgreen', '.darkred'],
            rotate: 360,
            borderRadius: '50%',
            duration: 3000,
            loop: true
        });
    }
</script>

如果错误仍然存在，您可以始终检查动画是否存在，检查window.anime !==是否未定义，否则使用超时，但我之前说过的这种方式应该有效。

票数 5

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/44027197

复制

相似问题

问为什么anime.js不能工作？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问为什么anime.js不能工作？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问为什么anime.js不能工作？
EN