如何修复双 Lottie 动画问题答案

【问题标题】：How to fix a double Lottie Animation problem如何修复双 Lottie 动画问题
【发布时间】：2021-12-25 23:15:22
【问题描述】：

你好吗？我正在为流媒体朋友做一个简单的网站。当我在做关于部分时，他想要一些关于他最喜欢的两件事的图片。但是当我插入一些 Lottie Animation IMG 时，其中一个变成了 double。

我将代码举例。

<div class="container">
<div class="row">
    <div class="col">
        <div id="F1"></div></a>
        <script src="lottie.js"></script>
        <script src="script.js"></script>
    </div>
<div class="col">
        <p class="Texto1">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>

我在 GitPages 中上传了网站，这是链接：https://bauditz.github.io/T0omp---Website-Project/about.html

感谢您的帮助！

【问题讨论】：

标签： javascript html css animation lottie

【解决方案1】：

在您的网站上，我可以看到您正在加载 F1 和 Fries 动画两次，我认为这不能解决您的问题，但最好只加载一次。

其次，我建议您尝试使用 lottie-web 而不是 bodymovin，这是 CDN 的链接：

https://cdnjs.cloudflare.com/ajax/libs/lottie-web/5.8.1/lottie.min.js

在您的脚本中，您必须将“bodymovin.loadAnimation”替换为“lottie.loadAnimation”

我下载了你的动画并在 lottiefiles.com 上查看了它看起来不错。

【讨论】：

【解决方案2】：

我认为您的 Lottie 文件包含两个动画对象。从 f1.json 或后效文件中删除一次对象，然后再次导出，享受

【讨论】：

抱歉，我不知道该怎么做。当我在 VS 中打开 Lottie.js 时，它们有很多代码，但没有任何意义。