🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

let-it-snow is a simple to use jQuery script to add CSS3 powered snowflakes falling animations on your web page for upcoming holidays.

snow

Documentation

let-it-snow

View demo

This is a little experiment on creating CSS snowflakes that stick/collect to elements. The collection of snowflakes is not the most realistic it could be but, hey, the logic is there!

Disclaimer: the JavaScript is really just an experiment and I can't vouch for the performance of it. While it doesn't noticeably slow down a page, there's a little callback hell that could definitely be cleaned up. This is only my attempt at the getting the logic down :)

Instantiation

$.letItSnow('.let-it-snow', {     stickyFlakes: 'lis-flake--js',     makeFlakes: true,     sticky: true }); 

Usage

You can definitely use just the CSS for some nice snowflakes. To do so, you can either create a bunch (100 is what I use) of elements on your page with the class name .lis-flake (<span class="lis-flake"></span>) OR use the JavaScript plugin to create them for you by setting the sticky property to false.


You May Also Like