jQuery Snowfall 1.5 update now with snow buildup!

Check out the new version here, with the ability to add images to snowflakes!

Repo on Github
Download Jquery Snowfall 1.5
View the plugin in action

Added snow buildup to the plugin, so now you can pass a jquery selector in the collection option and the snow will collect on top of all the elements matched. It uses the canvas tag so the snow wont collect in IE8 or lower. To enable collection you can do the following

    snowfall({collection : 'element'});

Element can be either a class or id or a list such as

    $(document).snowfall({collection : '.elements'});
    $(document).snowfall({collection : '#element'});

Thats pretty much it for new options below is the standard way of using the plugin.

Invoking the snow

    $(document).snowfall();
    $('#elementid').snowfall({flakeCount : 100, maxSpeed : 10});
    $('.class').snowfall({flakeCount : 100, maxSpeed : 10});

Snowfall Methods

    // stopping the snow
    $(document).snowfall('clear');
    $('#elementid').snowfall('clear');
    $('.class').snowfall('clear');

Options currently supported with default values

options = {
	flakeCount : 35,		// number
	flakeColor : '#ffffff', // string
	flakeIndex: 999999,		// number
	minSize : 1,			// number
	maxSize : 3,			// number
	minSpeed : 2,			// number
	maxSpeed : 3,			// number
	round : false,			// bool
	shadow : false,			// bool
        collection : 'element'          // string
};

Example

141 thoughts on “jQuery Snowfall 1.5 update now with snow buildup!

  1. Pingback: クリスマスの夜空に雪を降らせてみよう

  2. Pingback: 5 Top jQuery Snow Falling effect Plugin

  3. Pingback: ホームページに雪を降らせるjQueryプラグインやCSSを比較してみた | 姫路のホームページ作成会社 – WebryOne Inc.(ウェブリワン株式会社)

  4. Hello, thanks for the plugin, I have a question, when I have a large page (with scroll), the snow effect just have function in half part of the page (on the top), don’t function in all the page, Can I change the time of live? or change the some size? (sorry if my english is bad), thanks and regards

  5. Well i change the line
    elHeight = $(element)[0].clientHeight;
    for:
    elHeight = $(“body”)[0].scrollHeight;
    in the line 252 and 214 from the file snowfall.jquery,js, and function like i wanted, thanks

  6. Pingback: Christmas 2011 Count Down - Peter Fisher

  7. salut merci bien pour le tuto mais j’ai un petit problème avec ce plugin
    quand j’ajoute l’option collection le mouvement du snow se bloque !
    j’ai essayé plusieurs fois mais toujours la meme chose dès que j’ajoute
    $(document).snowfall({collection : ‘#id-de-mon-bouton sur-lequel-je-veux-que-la-neige-secollecte’});
    les graines de neige deviennent fixes sur ma page! rien ne bouge
    any help please?

Leave a Reply

Your email address will not be published. Required fields are marked *