<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>lottie 极简Demo</title>
    <!-- 第一步: 引入CDN -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.8.1/lottie.min.js"></script>
  </head>
  <body>
    <!-- 第二步: 创建容器 -->
    <div id="container"></div>
  </body>
  <script>
    // 第三步: 实例化
    var anim = lottie.loadAnimation({
      container: document.getElementById("container"), // 容器
      renderer: "svg",
      loop: true,
      autoplay: true,
      path:"load.json" // json地址，可以为网络地址
    });
  </script>
</html>

效果：
在这里插入图片描述
中文文档：点击这里 https://www.yuque.com/lottie/document/web
cdn：点击这里 https://cdnjs.com/libraries/bodymovin

# javascript # 动画 # 前端
Logo
技术共进，成长同行——讯飞AI开发者社区

技术共进，成长同行——讯飞AI开发者社区

更多推荐

cover

国内开发者大模型学习路线：六阶跃迁，从入门到企业级实战，一篇掌握大模型应用开发秘籍！

avatar 讯飞AI开发者社区
cover

人工智能开发工具全景指南：从编码辅助到模型部署的全链路实践

avatar 讯飞AI开发者社区

Python简介与入门

Python作为一门易学易用的编程语言，不仅适合初学者，也能满足高级开发者的需求。无论是Web开发、数据科学，还是人工智能，Python都能为你提供强大的支持。希望本文能够帮助你了解Python的基础知识，激发你进一步探索Python的兴趣。继续努力，成为一名优秀的Python开发者吧！??

avatar 讯飞AI开发者社区