spmbt / snowfalls

Some scripts of moving snowflakes on DOM layers and Canvas

snowfalls

Some scripts of moving snowflakes on DOM layers and Canvas

Article (in Russian) about snowfall scripts (12 variants) for DOM and Canvas scenes - Habrahabr (ext. link). Codes, FPS, screenshots.

Script groups and variations

For better run and inspecting of selected old scripts its are located here with necessary facilities and rework, from little to more.

• falling-snow
  • original (2005) demo script with some forms for start it in various modes (stop button is present);
  • original (2005) demo script without forms on clean list; jsFiddle;
  • original (2006) demo script with approaching of flakes; jsFiddle;
• jSnow
  • demo code of 2 processes of snow falling in container and in whole window;
  • demo code of snow falling in multiple containers and in whole window at one time;
  • demo script giving one instance of process on the page (analog of original script); jsFiddle;
  • original jsFiddle (2009) version 1.1.mod1 (footprints of unpacking); ext.link;
  • original jsFiddle script 1.1mod2 (2010) with compatibility of jQuery 2.X;
  • original jsFiddle (2009) obfuscated version 1.2 (original source is absent); ext.link;
• snow-canvas
  • demo code falling in list folded in torus (isothropic); jsFiddle;
  • demo code falling with snow melting on the ground; jsFiddle;
  • demo code variant of melting with photo; jsFiddle;
  • "Snow Effect using..." is prototype of snow-canvas from TheCodePlayer playground; copy to jsFiddle;
• snowMachine - variant with similar code from kafeman

Use pages of demo for show effects and experiments with parameters. Use newest versions of code for run in another pages.

Assets of selected scripts

'falling-snow' - most natural moving of flakes using 4 parameters and 1 of themсфыгфд is harmonical.

'jSnow' - fairly natural movement with this parameters (big and slow harmonical gusts to left and right). More simple maths.

'snow-canvas' - method of fast and massive animations using Canvas object of HTML5. When no additiona library, we arrive maximum of visual effects. In this variant the method of casual deviations is used, without harmonic functions.

'snowMachine' - combined constructor for create DOM-manager od Canvas one;

• ... - additional visual effects based on 'snow-canvas' engine: snow growing;