FREE ADDON: Let It Snow (in the background)

Hi again fellows

a small free addon to get as in the mood. Let it snow, in the background.

Simple and discreet. Just install and thats all. You can if you want, to control the amount of flakes and the speed in lines 13 & 14 in the addons/let_it_snow/hooks/index/ (for ver 2.2.x)

If you have problems with the script (any conflicts with other jquery) then just delete the following first lines of the script.(for ver 2.2.x)





Its 2.2.x and 3.0.x compatible. v 2.2.x shoud also work for older versions. Try it out and let me know.

Who says it's too early for Christmas? It's never too early to make merry and spread peace and goodwill toward your fellow man! Merry Early Christmas!





Snow will eat up a lot of CPU, even on modern computers, because of the number of elements being moved around the screen at once

By default, mobile phones are excluded from the snow effect to be nice to their CPUs (and batteries), but you can set (in v3 addon ) snowStorm.excludeMobile = false; to enable Snowstorm on devices like the iPhone,


New Version for 2.2.x - 13/12/2012


Its using the same script as the V3

Try it out if you have any jquery problems


New Version for 4.0…x - 6/12/20123

[attachment=7448:Let it snow]






Let it snow

V3 at all?

[quote name='Gizmo' timestamp='1352968099' post='149220']

V3 at all?


Hi look at the original post


Haha, this will look nice @ christmas. Thanks for sharing :)

Thanks for the cool post damn I have a white background :(

have a live demo?

Love this addon thanks so much.

You can check the demo on my website

Let it Snow!

[url=“Dean Martin - Let it Snow! - YouTube”]Dean Martin - Let it Snow! - YouTube

looks very christmasy! Thanx!


hope you will enjoy it!

Had anybody had any problems with it so far?


Is great but it would stand out on my background a bit more ( I have lots of yellow) if I could make the flakes a little bigger, is this possible Fotis.


Hi John

I will have to look if this is possible…


Demo here on my site I messing about with till after xmas.

Trouble is I have a white background (i need to learn how to change that)…


You need to change in skins/basic/customer


[]the images in background at .main and .header in styles.css

]the background-color at body in styles.css


If you dont know your way around basic css editing better dont try this, or keep a backup of these files.

Also go to the post for product labels and download the fix, as the soldout label is at the left corner of your site and not the product!



Try in v3.0.x to open the file snow.js in /addons/let_it_snow/js

You can tweek this values

// --- common properties ---
this.autoStart = true; // Whether the snow should start automatically or not.
this.flakesMax = 250; // Limit total amount of snow made (falling + sticking)
this.flakesMaxActive = 104; // Limit amount of snow falling at once (less = lower CPU use)
this.animationInterval = 33; // Theoretical "miliseconds per frame" measurement. 20 = fast + smooth, but high CPU use. 50 = more conservative, but slower
this.excludeMobile = true; // Snow is likely to be bad news for mobile phones' CPUs (and batteries.) By default, be nice.
this.flakeBottom = null; // Integer for Y axis snow limit, 0 or null for "full-screen" snow effect
this.followMouse = true; // Snow movement can respond to the user's mouse
this.snowColor = '#efefef'; // Don't eat (or use?) yellow snow.
this.snowCharacter = '•'; // • = bullet, · is square on some systems etc.
this.snowStick = true; // Whether or not snow should "stick" at the bottom. When off, will never collect.
this.targetElement = null; // element which snow will be appended to (null = document.body) - can be an element ID eg. 'myDiv', or a DOM node reference
this.useMeltEffect = true; // When recycling fallen snow (or rarely, when falling), have it "melt" and fade out if browser supports it
this.useTwinkleEffect = false; // Allow snow to randomly "flicker" in and out of view while falling
this.usePositionFixed = false; // true = snow does not shift vertically when scrolling. May increase CPU load, disabled by default - if enabled, used only where supported
// --- less-used bits ---
this.freezeOnBlur = true; // Only snow when the window is in focus (foreground.) Saves CPU.
this.flakeLeftOffset = 0; // Left margin/gutter space on edge of container (eg. browser window.) Bump up these values if seeing horizontal scrollbars.
this.flakeRightOffset = 0; // Right margin/gutter space on edge of container
this.flakeWidth = 26; // Max pixel width reserved for snow element
this.flakeHeight = 26; // Max pixel height reserved for snow element
this.vMaxX = 5; // Maximum X velocity range for snow
this.vMaxY = 4; // Maximum Y velocity range for snow
this.zIndex = 0; // CSS stacking order applied to each snowflake
// --- End of user section ---

this.flakeWidth and this.flakeHeight is the values you are looking

great stuff, works a treat @ 14


nice work m8 :D


I love this addon, but it prevents my Sign In dropdown box from working. Any fixes?


what version are you using?