Unobtrusive Falling Snow

Completely Rewritten To Use Modern JavaScript

Just as with my original falling snow script, it can snow all year round on your web page if you incorporate this special effect script into your page. In fact it is even easier with this version as it is completely unobtrusive and just needs a single script tag added to the bottom of the web page in order to link the script to the page. This version works in all modern browsers but doesn't support IE4 and Netscape 4 the way the original script did - but then no one has used either of those browsers for many years now (although many still did in 2004 when the original was written).

As with the original falling snow script, this version has a number of snowflakes drifting slowly down the browser window in front of the page content and the page can be scrolled behind the smow and the snow just keeps on falling.

This page illustrates the exact effect that the script provides as the script is linked into the bottom of this page.

If you want to add this effect to any of your web pages then the next step is to select the code from the text box below (there is a highlight all button beneath it to make this easier) and copy and paste it into a file called snow.js.

The only place in the Javascript that you may want to alter is the one at the very end where array of snowflake images and the number of snow flakesto be displayed are specified.

snowflake image 1snowflake image 2

The other thing that you will need to copy in addition to the script are the snowflake images. To do this simply right click on each of the static snowflake images at the left of this paragraph and select save picture as or save image (depending on which browser you are using). You need to save the images as snowflake.gif and snowflake1.gif unless you are going to update the names at the end of the script. The snowflake images used here were provided back in 2004 by the Graphics Software Guide at who kindly gave permission for me to include them with the script. You can of course use your own snowflake images if you prefer and can even add more than two images to the array if you wish.

All that remains to be done now is to add the falling snow script into your web page. To do this we simply place the following into the bottom of the HTML immediately before the </body> tag.

<script src="snow.js" type="text/javascript">


This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow