使用particles.js和fullpage.js会出现问题吗？
使用particles.js和fullpage.js会出现问题吗？
提问于 2017-09-11 08:15:23
我正在尝试使用fullpage.js库构建一个单页面站点，效果非常好！我还想将particle.js库中的粒子效果添加到我的站点的第一部分。
无论我怎么尝试，似乎粒子都没有出现，我不确定是什么问题，任何帮助我都很感激！我的代码如下：
HTML：
<div class="section" id="particles-js"></div>JS：
particlesJS.load('particles-js', '/assets/particles.json', function() {
console.log('callback - particles.js config loaded');
});CSS：
#particles-js {
background: cornflowerblue;
}与here一样，我的particles.json文件是库提供的默认文件。
我的JS代码在一个名为init_libraries.js的文件中，该文件被添加到我的HTML页面，如下所示：
<script src="/javascript/bootstrap.min.js"></script>
<script src="/javascript/jquery.fullPage.min.js"></script>
<script src="/javascript/particles.min.js"></script>
<script src="/javascript/init_libraries.js"></script> 当我启动我的站点时，我看到"callback - particles.js配置已加载“的消息，所以库和配置文件看起来加载得很好，但我仍然在我的站点上看不到任何粒子。有什么想法吗？
编辑：
一段时间后，我最终弄明白了这一点，我不得不像这样更改我的HTML：
<div id="particles-js">
<canvas class="particles-js-canvas-el" style="width: 100%; height: 100%;"></canvas>
</div> 此外，我还必须在CSS中添加以下内容，以便粒子位于文本和按钮的后面：
canvas {
position: absolute;
top: 0;
z-index: 1;
}
.container a {
position: relative;
z-index: 9999;
}
.container h1 {
position: relative;
z-index: 9999;
}现在效果很好！所有的库js文件都在正确的位置。
回答 1
Stack Overflow用户
发布于 2017-09-11 08:32:21
我猜你的资产不在你的javascript文件夹中。检查'particles.json‘的相对路径是否正确。
particlesJS.load('particles-js', '../assets/particles.json', function() {
console.log('callback - particles.js config loaded');
});对不起，无可奉告:/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/46146698
复制相关文章
相似问题
腾讯云开发者
