javascript - particles-js 没有覆盖整个页面
问题描述
我对particles-js 有一些问题,首先,它没有覆盖整个页面。其次,由于某种原因,我无法与粒子交互。
这是 HTML 的代码:
<script type="text/javascript" src="js/particles.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
And this is my css for particles-js:
#particles-js{
position : absolute;
width:100%;
height:100%;
z-index:-1;
background-image: url(gfx/testback.png);
}
[1]: https://i.stack.imgur.com/XO6w5.png
解决方案
像我的网站一样,用粒子 js 覆盖所有页面真的很容易:https ://askianoor.ir 你应该添加一个高度为 100 的 div
编辑版本:
<body>
<div class="h-100">
<!-- PARTICLES-->
<div id="particles-js">
<div class="position-absolute w-100">
Place your text here !
</div>
</div>
</div>
</body>
在 CSS 中:
#particles-js {
position: absolute;
width: 100%;
height: 100%;
background-color: #b61924;
background-image: url(gfx/testback.png);
background-repeat: no-repeat;
background-size: cover;
background-position: 50% 50%;
}
推荐阅读
- c# - 通过 AWS API Gateway 上传的 PDF 已损坏
- python - 提高函数运行时间
- javascript - 如何在openlayers地图中绘制svg
- mysql - 如果该组中没有记录,如何使计数在 5 分钟后返回 0?
- java - 双变量中的大值在 TextView 中显示不同
- c# - IDataReader 为 20m 条记录消耗大量内存
- git - Gitlab合并本地分支
- javascript - Fetch API:请求完成后“await res.json()”会失败吗?
- python - Popen 的意外输出
- php - 未发送到 office365 邮件客户端的电子邮件