【问题标题】：Advanced animations question (websites). How to make image animations like on the following website [closed]高级动画问题（网站）。如何在以下网站上制作图像动画[关闭]
【发布时间】：2021-08-15 23:53:08
【问题描述】：
http://www.mikimottes.com/这是我要问的网站！
我已经学会了如何制作简单的动画。但是当我发现这个网站时，我就爱上了它，并想学习如何制作这样的网站。我想知道例如图像动画，它们是如何开发的？我有一些建议，它可能与 GIF 有关，但是如何控制 GIF？有时图像的动画会停止，然后某些东西会触发它们进行动画处理。 GIF 似乎是不可能的。它看起来不像一个js动画。请在这个问题上帮助我。 :)
【问题讨论】：
标签：
javascript
reactjs
image
animation
css-animations
【解决方案1】：
这些效果基于普通的CSS animations。您可以使用浏览器开发工具轻松查看给定动画使用的样式和参数（例如，在 Firefox 中，右键单击动画并选择“检查元素”）。
例如，在左上角的两个风力涡轮机之间盘旋的蓝色小动物使用此图像制作动画：
要对它的完成方式有一个非常基本的了解，您可以查看this blog post
我怀疑您需要一些额外的工具，例如像样的绘画程序来自动执行某些步骤（例如，使用图层并从一组图纸中自动生成连续的帧），但我想对于简单的情况可以手动完成。