角 ng 粒子作为背景答案

【问题标题】：Angular ng-particles as background角 ng 粒子作为背景
【发布时间】：2021-08-13 18:36:49
【问题描述】：

我正在尝试在我的 Angular 12 项目中使用 ng-particles 作为背景。
这是我的 app.component.html：

<div class="main">
    <ng-particles [id]="id" [options]="particlesOptions"></ng-particles>
    <div>
        <app-header></app-header> 
        <router-outlet></router-outlet>
    </div>
    <app-footer></app-footer>
</div>

粒子工作正常，但显然它只是我的页眉、路由器出口和页脚上的一个元素。我如何在 Angular 中获得 ng-particles 作为背景？
我一直在寻找，但没有找到好的例子。我曾尝试在 ng-particles 元素上设置 position:absolut ，但这会导致出现故障行为。谢谢你的帮助！
这是我现在使用的模块： https://www.npmjs.com/package/ng-particles

【问题讨论】：

标签： html css angular particles.js

【解决方案1】：

您可以仅使用选项将粒子设置为背景。不需要额外的 CSS。

您可以在此处查看fullScreen 选项：https://particles.js.org/docs/interfaces/Options_Interfaces_FullScreen_IFullScreen.IFullScreen.html

所以，您唯一需要的就是将其添加到您的粒子配置中：

{
  fullScreen: {
    enable: true,
    zIndex: 0 // or any value is good for you, if you use -1 set `interactivity.detectsOn` to `"window"` if you need mouse interactions
  },
  /* your config */
}

【讨论】：