动画容器/行背景

Question

谁能告诉我如何获得更多的信息，并学习如何创建与这个网站类似的背景- https://greatminds.training/？

标题背景图像移动，并有另一个更低一点的页面，也有动画后面的静态文本。

正在使用哪些组件来产生这种效果？

Answer 1

如果您要使用开发人员控制台检查该站点，您将看到它们有几个SVG文件，它们在页面加载时使用CSS转换动画了几秒钟：

蓝色高亮显示的部分是由CSS转换动态更新的内联CSS，以反映动画(您将看到这些行不断变化，直到它们的SVG停止动画)。

其中一个SVG作为一个例子：

​

当涉及到为任何像这样或更复杂的东西动画SVG时，我个人更喜欢一个名为GSAP的JS库。他们有大量的动画实用程序和一个非常棒的支持论坛，以帮助您开始这样的项目。