使用此Javascript库创建漂亮的动画粒子

但是,新的Particles.js库通过创建在整个页面中实时移动的 动画粒子朝着全新的方向发展。

有大量免费的动画库,它们都有不同的效果和特色。

它当然不会帮助您改善网站的用户体验,但可以帮助您向背景中添加一些隔行的粒子效果

这个易于使用的库是完全免费的,并在GitHub上开源

这使您可以调整颗粒大小,速度,形状,颜色,位置,并为其命名。

主页上 ,您将找到一个实时交互式演示 ,您可以在其中演示图书馆的功能。

使用此Javascript库创建漂亮的动画粒子

这就是为什么此实时演示如此有价值的原因,因为它使任何人都可以使用这些设置来了解JavaScript的功能。

由于这是一个详细的库,因此确实需要对JavaScript充分的了解才能使其正常工作。

您可以导出原始的PNG ,甚至可以将所有自定义设置保存到JSON文件中,然后直接导入到Particles.js脚本中。

而且,如果您可以导出这些图形,可以直接从Web应用程序演示页面保存图像

默认情况下,您可以从少数具有不同粒子样式的主题中进行选择:

  • 美国宇航局的星星
  • 泡泡
  • 尼安猫明星
  • 默认几何形状

使用这些默认设置,您仍然可以编辑所有主要设置以完善颜色,位置,速度和其他所有设置

使用此Javascript库创建漂亮的动画粒子

如果您想深入了解细节,那么您确实需要了解JavaScript和前端编码

整个库中最好的部分是主页上的实时自定义功能

但是,即使是初学者也可以通过界面进行操作,选择所需的设置,然后将所有内容导出为JSON文件。

要了解更多信息,请访问GitHub存储库 ,您可以在Twitter @VincentGarreau上与创建者Vincent Garreauon分享您的想法。

对于任何希望在网络上创建动态粒子的人来说,这都是一个出色的库。


翻译自: https://www.hongkiat.com/blog/animated-particles-js/