diff options
author | Michael Foiani <sotech117@michaels-mbp-21.devices.brown.edu> | 2022-09-02 10:44:54 -0400 |
---|---|---|
committer | Michael Foiani <sotech117@michaels-mbp-21.devices.brown.edu> | 2022-09-02 10:44:54 -0400 |
commit | 1a8ec25c000bbc01a02eeab8f25c2ec3ab5db829 (patch) | |
tree | e7de89ad0b4bfcddbe41412a83e2aae6b36aea23 /particles.js-master/demo/js/app.js | |
parent | db96a28be71373866a969af160b82b1db65d5f3c (diff) |
first rendition - got feeback
Diffstat (limited to 'particles.js-master/demo/js/app.js')
-rw-r--r-- | particles.js-master/demo/js/app.js | 133 |
1 files changed, 133 insertions, 0 deletions
diff --git a/particles.js-master/demo/js/app.js b/particles.js-master/demo/js/app.js new file mode 100644 index 0000000..4b9052e --- /dev/null +++ b/particles.js-master/demo/js/app.js @@ -0,0 +1,133 @@ +/* ----------------------------------------------- +/* How to use? : Check the GitHub README +/* ----------------------------------------------- */ + +/* To load a config file (particles.json) you need to host this demo (MAMP/WAMP/local)... */ +/* +particlesJS.load('particles-js', 'particles.json', function() { + console.log('particles.js loaded - callback'); +}); +*/ + +/* Otherwise just put the config content (json): */ + +particlesJS('particles-js', + + { + "particles": { + "number": { + "value": 80, + "density": { + "enable": true, + "value_area": 800 + } + }, + "color": { + "value": "#ffffff" + }, + "shape": { + "type": "circle", + "stroke": { + "width": 0, + "color": "#000000" + }, + "polygon": { + "nb_sides": 5 + }, + "image": { + "src": "img/github.svg", + "width": 100, + "height": 100 + } + }, + "opacity": { + "value": 0.5, + "random": false, + "anim": { + "enable": false, + "speed": 1, + "opacity_min": 0.1, + "sync": false + } + }, + "size": { + "value": 5, + "random": true, + "anim": { + "enable": false, + "speed": 40, + "size_min": 0.1, + "sync": false + } + }, + "line_linked": { + "enable": true, + "distance": 150, + "color": "#ffffff", + "opacity": 0.4, + "width": 1 + }, + "move": { + "enable": true, + "speed": 6, + "direction": "none", + "random": false, + "straight": false, + "out_mode": "out", + "attract": { + "enable": false, + "rotateX": 600, + "rotateY": 1200 + } + } + }, + "interactivity": { + "detect_on": "canvas", + "events": { + "onhover": { + "enable": true, + "mode": "repulse" + }, + "onclick": { + "enable": true, + "mode": "push" + }, + "resize": true + }, + "modes": { + "grab": { + "distance": 400, + "line_linked": { + "opacity": 1 + } + }, + "bubble": { + "distance": 400, + "size": 40, + "duration": 2, + "opacity": 8, + "speed": 3 + }, + "repulse": { + "distance": 200 + }, + "push": { + "particles_nb": 4 + }, + "remove": { + "particles_nb": 2 + } + } + }, + "retina_detect": true, + "config_demo": { + "hide_card": false, + "background_color": "#b61924", + "background_image": "", + "background_position": "50% 50%", + "background_repeat": "no-repeat", + "background_size": "cover" + } + } + +);
\ No newline at end of file |