无法以我想要的方式对SVG进行动画处理

时间:2020-06-28 20:26:58

标签: html css animation svg

我对SVG以及如何使用它们非常陌生。我不是要您提供答案代码,而是要提供有关某些插件的指南,有关我如何以希望的方式对此SVG进行动画处理的文章或建议。

Problem:

我想对太阳下面的图片进行动画处理,很明显,我将创建该图像的矢量图形,但是我想要的是这些在太阳底部切割的动画并从上到下移动揭示主要太阳后面的背景和第二个太阳。

我想在网页中执行此操作,因此我需要有关此的帮助。

就像我无法弄清楚如何减少这些削减的整个过程。任何帮助将不胜感激。

enter image description here

1 个答案:

答案 0 :(得分:0)

我会尝试https://rive.app/

就如何,我将创建一个短的无限循环。水平条可能需要是自己的形状,并在其上具有某种遮罩效果才能使圆变圆。您必须补间它们以在Y轴上向上移动,并在高度向上移动时使其高度缩小至零。动画可能只有250-750ms。让我知道是否可行!