0

I have used the particle JS CDN from here (https://vincentgarreau.com/particles.js/#default) and I have managed to integrate it in my project and it works on the localhost.

However when I upload it on the server it doesn't work anymore.

These are the CDNs: <script src="http://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script> <script src="http://threejs.org/examples/js/libs/stats.min.js"></script>

I then added the particles in my index.html page:

<div id="particles-js"></div>

I linked my index.html to the particles.js file:

<script src="particles.js"></script>

I added the styling in my style.css file:

/* Particles  */

canvas{ 
 display: block; 
 vertical-align: bottom; 
} 

/* ---- particles.js container ---- */ 

#particles-js{ 
 position:absolute; 
 width: 100%; 
 height: 900px; 
}

Why is it not displaying when it is uploaded onto the host?

Diana Rugea
  • 1
  • 2
  • Is there any error in the console? – Om Fuke Mar 04 '21 at 00:31
  • 2
    if it works in local host and not on remote, its usually a path issue. research it, and read this: https://www.w3schools.com/Html/html_filepaths.asp - https://stackoverflow.com/questions/296873/basic-html-how-to-set-relative-path-to-current-folder Also I don't understand, are you using local or CDN particles.js, you do not need two i believe... – ikiK Mar 04 '21 at 00:41

2 Answers2

0

If you are developing a Node project, you can try installing the node module if available so you do not have to depend on the CDN. Alternatively, you can also download the zip on the website and include it directly in your HTML script. As mentioned by @ikiK in a comment, it might be a path issue. Try using relative path like ./path/to/particles.js instead of absolute paths if you are doing so.

deekeh
  • 675
  • 1
  • 6
  • 21
0

Thanks everyone, it works now!

The problem was that my website has a SSL certificate - HTTPS ("https://") and the CDN I was using in my index.html was HTTP only("http://"), therefore my browser kept giving me an error and was not loading the particlesJS CDN.

I've just changed the CDN path to "https://" and it work perfectly now. Thanks again!

Diana Rugea
  • 1
  • 2