Animación interactiva de partículas con JavaScript-JParticles
| Autor: | Barrior |
|---|---|
| Views Total: | 4,511 |
| Sitio oficial: | Ir a la web |
| Actualizado: | September 21, 2018 |
| Licencia: | MIT |
Vista prévia
Descripción
Una biblioteca nativa de JavaScript para crear animaciones de partículas animadas, interactivas y configurables en un elemento Canvas que reacciona al cursor.
Instalación
$ npm install JParticles
Funcionamiento
Cargue la biblioteca JParticles en el documento HTML.
<script src="/path/to/particleground.all.js"></script>
O …
<script src="/path/to/particleground.js"></script> <script src="/path/to/particle.js"></script>
Cree un contenedor DIV para colocar la animación de partículas.
<div id="demo" style="width: 400px; height: 250px;"></div>
Crea un nuevo objeto de partícula y ya terminamos.
new Particleground.particle( '#demo' );
Opciones de configuración predeterminadas.
// amount of particles num: .12, // max size maxR: 2.4, // min size minR: .6, // distance between particles proximity: .2 // 0 = no line range: .2 // max animation speed maxSpeed: 1, // min animation speed minSpeed: 0, // line width lineWidth: .2, // 'spider' or 'cube' lineShape: 'spider' // null = canvas eventElem: null, // enable parallax effect parallax: false, // depth of layer parallaxLayer: [1, 2, 3], // parallax strength parallaxStrength: 5
Registro de cambios
v2.0.1 (09/21/2018)
- Bugfix
