1/* ----------------------------------------------- 2/* How to use? : Check the GitHub README 3/* ----------------------------------------------- */ 4 5/* To load a config file (particles.json) you need to host this demo (MAMP/WAMP/local)... */ 6/* 7particlesJS.load('particles-js', 'particles.json', function() { 8 console.log('particles.js loaded - callback'); 9}); 10*/ 11 12/* Otherwise just put the config content (json): */ 13 14function addParticleJs(id) { 15 // 'particles-js-menu' 16 // 'particles-js-menu-2' 17 particlesJS(id, 18 { 19 "particles": { 20 "number": { 21 "value": 60, 22 "density": { 23 "enable": true, 24 "value_area": 800 25 } 26 }, 27 "color": { 28 "value": "#F29C6D" 29 }, 30 "shape": { 31 "type": "circle", 32 "stroke": { 33 "width": 0, 34 "color": "#F29C6D" 35 }, 36 "polygon": { 37 "nb_sides": 5 38 }, 39 "image": { 40 "src": "img/github.svg", 41 "width": 100, 42 "height": 100 43 } 44 }, 45 "opacity": { 46 "value": 0.5, 47 "random": false, 48 "anim": { 49 "enable": false, 50 "speed": 1, 51 "opacity_min": 0.1, 52 "sync": false 53 } 54 }, 55 "size": { 56 "value": 5, 57 "random": true, 58 "anim": { 59 "enable": false, 60 "speed": 40, 61 "size_min": 0.1, 62 "sync": false 63 } 64 }, 65 "line_linked": { 66 "enable": true, 67 "distance": 150, 68 "color": "#F29C6D", 69 "opacity": 0.6, 70 "width": 1.2 71 }, 72 "move": { 73 "enable": true, 74 "speed": 3, 75 "direction": "none", 76 "random": false, 77 "straight": false, 78 "out_mode": "out", 79 "attract": { 80 "enable": false, 81 "rotateX": 600, 82 "rotateY": 1200 83 } 84 } 85 }, 86 "interactivity": { 87 "detect_on": "canvas", 88 "events": { 89 "onhover": { 90 "enable": true, 91 "mode": "repulse" 92 }, 93 "onclick": { 94 "enable": true, 95 "mode": "push" 96 }, 97 "resize": true 98 }, 99 "modes": { 100 "grab": { 101 "distance": 400, 102 "line_linked": { 103 "opacity": 1 104 } 105 }, 106 "bubble": { 107 "distance": 400, 108 "size": 40, 109 "duration": 2, 110 "opacity": 8, 111 "speed": 3 112 }, 113 "repulse": { 114 "distance": 200 115 }, 116 "push": { 117 "particles_nb": 4 118 }, 119 "remove": { 120 "particles_nb": 2 121 } 122 } 123 }, 124 "retina_detect": true, 125 "config_demo": { 126 "hide_card": false, 127 "background_color": "#b61924", 128 "background_image": "", 129 "background_position": "50% 50%", 130 "background_repeat": "no-repeat", 131 "background_size": "cover" 132 } 133 } 134 135 ); 136} 137 138 139 140particlesJS('particles-js', 141 142 { 143 "particles": { 144 "number": { 145 "value": 80, 146 "density": { 147 "enable": true, 148 "value_area": 800 149 } 150 }, 151 "color": { 152 "value": "#8349a3" 153 }, 154 "shape": { 155 "type": "circle", 156 "stroke": { 157 "width": 0, 158 "color": "#ffffff" 159 }, 160 "polygon": { 161 "nb_sides": 5 162 }, 163 "image": { 164 "src": "img/github.svg", 165 "width": 100, 166 "height": 100 167 } 168 }, 169 "opacity": { 170 "value": 0.5, 171 "random": false, 172 "anim": { 173 "enable": false, 174 "speed": 1, 175 "opacity_min": 0.1, 176 "sync": false 177 } 178 }, 179 "size": { 180 "value": 5, 181 "random": true, 182 "anim": { 183 "enable": false, 184 "speed": 40, 185 "size_min": 0.1, 186 "sync": false 187 } 188 }, 189 "line_linked": { 190 "enable": true, 191 "distance": 150, 192 "color": "#8892c9", 193 "opacity": 0.4, 194 "width": 1.2 195 }, 196 "move": { 197 "enable": true, 198 "speed": 3, 199 "direction": "none", 200 "random": false, 201 "straight": false, 202 "out_mode": "out", 203 "attract": { 204 "enable": false, 205 "rotateX": 600, 206 "rotateY": 1200 207 } 208 } 209 }, 210 "interactivity": { 211 "detect_on": "canvas", 212 "events": { 213 "onhover": { 214 "enable": true, 215 "mode": "repulse" 216 }, 217 "onclick": { 218 "enable": true, 219 "mode": "push" 220 }, 221 "resize": true 222 }, 223 "modes": { 224 "grab": { 225 "distance": 400, 226 "line_linked": { 227 "opacity": 1 228 } 229 }, 230 "bubble": { 231 "distance": 400, 232 "size": 40, 233 "duration": 2, 234 "opacity": 8, 235 "speed": 3 236 }, 237 "repulse": { 238 "distance": 200 239 }, 240 "push": { 241 "particles_nb": 4 242 }, 243 "remove": { 244 "particles_nb": 2 245 } 246 } 247 }, 248 "retina_detect": true, 249 "config_demo": { 250 "hide_card": false, 251 "background_color": "#b61924", 252 "background_image": "", 253 "background_position": "50% 50%", 254 "background_repeat": "no-repeat", 255 "background_size": "cover" 256 } 257 } 258 259); 260
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.