Subtle Particles Animation In Vanilla JavaScript – bParticles.js

Category: Animation , Javascript | August 5, 2018
Author: BowersDev
Views Total: 884
Official Page: Go to website
Last Update: August 5, 2018
License: MIT

Preview:

Subtle Particles Animation In Vanilla JavaScript – bParticles.js

Description:

bParticles.js is a vanilla JavaScript plugin for creating a subtle particles animation using HTML5 canvas.

The plugin enables you to generate configurable particles that move randomly within a specified container.

How to use it:

Download and import the ‘bParticles.js’ library into the document.

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

Create a new bParticles object and apply the Particles Animation to a container you specify.

<div id="example"></div>
bParticles({
  "container": "#example"
})
bParticles({

  // target container
  "container": "#example",

  // FPS
  "fps": 30,
  
  // the amount of particles to generate
  "amount": 30,

  // min/max sizes
  "size":{
    "min": 2,
    "max": 48
  },

  // min/max animation speed
  "speed":{
    "min": 2,
    "max": 10
  },

  // particle styles
  "style":{
    "backgroundColor": "",
    "fill":{
      "color": "#66FF00",
      "opacity": "0.8"
    }
  }
  
})

Changelog:

08/05/2018

  • v2

You Might Be Interested In:

Leave a Reply