Create Fantastic Canvas Based Bubble Animations - circleMagic.js
| File Size: | 13.1 KB |
|---|---|
| Views Total: | 8381 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
circleMagic.js is a jQuery plugin that lets you create a fantastic bubble animation effect for the background of any container by using HTML5 canvas API.
How to use it:
1. Load the latest version of jQuery library and the jQuery circleMagic.js script at the end of the document.
<script src="//code.jquery.com/jquery-3.2.1.slim.min.js"></script> <script src="circleMagic.min.js"></script>
2. Call the main function circleMagic on the target container on which you want to generate the bubble animation effect.
$('.container').circleMagic({
elem: '.container'
});
3. Customize the bubble animation effect by overriding the default values as shown below to your taste.
$('.container').circleMagic({
elem: '.container',
color: 'rgba(255,255,255,.5)',
radius: 10,
densety: 0.3,
clearOffset: 0.2
});
Change log:
2017-07-31
- rewrite for pre-ES6 browsers
This awesome jQuery plugin is developed by FreAK19. For more Advanced Usages, please check the demo page or visit the official website.











