jQuery Plugin To Create Snowfall Animations On Your Web Page - Snowfall
| File Size: | 634 KB |
|---|---|
| Views Total: | 12356 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Snowfall is a jQuery plugin designed for winter or Christmas themed website that helps you add amazing snow falling effects on your web page. The plugin uses either Html elements or a JPG as falling snowflakes. Also comes with a standalone version which you can use it in vanilla Javascript.
Your might also like:
- Realistic Raindrops Effect with Canvas and Rainyday.js
- Yet Another Falling Snow Animation with jQuery and Canvas - GlauserChristmas
- Creating Snow Falling Effect with jQuery snowfall Plugin
- Falling Snow Effect with jQuery and HTML5 Canvas - Let It Snow
Basic Usage:
1. Load jQuery library and the jQuery snowfall plugin in your web page.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src='path/to/snowfall.jquery.min.js'></script>
2. Create a container where you wish to implement the snow falling effects.
<body class="demo"> </dody>
3. Initialize the plugin to enable the snowfall animation.
document.body.className = "demo"; $(document).snowfall(OPTIONS);
4. Available options.
flakeCount : 35, flakeColor : '#ffffff', flakeIndex: 999999, minSize : 1, maxSize : 2, minSpeed : 1, maxSpeed : 5, round : false, // makes the snowflakes rounded if the browser supports it. shadow : false, // gives the snowflakes a shadow if the browser supports it. image : "images/flake.png" },
Change logs:
2016-02-28
- update hardcoded color values to use flakeColor variable that is it
2014-12-07
- Fixed issue that caused flakes speed to double based on the amount of times `snowfall` was called on the page. Also removed ID checks in the jQuery script clear function
2014-12-06
- removed flake id's altogether since they weren't really used at all and just added extra noise to the flake markup. Since every flake has a class and is tied to a parent element we can just reference them using that information.
2014-11-28
- fix scrollbar (vertical)
2014-11-20
- Added polyfill for requestAnimationFrame
This awesome jQuery plugin is developed by loktar00. For more Advanced Usages, please check the demo page or visit the official website.
