Skip navigation

We are still here! - Following government advice we are now working with most of our staff at home, but otherwise operating as normal. Please see our Contact page for more information on the best way to contact us during this time.

Blog > Website snow effect for Christmas

As it's almost the festive season and already getting colder, it can only be time to roll out a simple snow effect. The effect you see in the banner above this blog is a MooTools script which can use text or images to model the snowflakes you see drifting across the banner.

The script is available to view at: http://www.bluelinemedia.co.uk/javascript/snow.js.

As you can see the script is based on <a href="http://pr0digy.com/mootools/text-snow/">http://pr0digy.com/mootools/text-snow/</a> which has been copied and extended a couple of times. The only changes I had to make here was to modify a few parameters to make the snow appear as a continual stream rather than waves of snow and to sort a couple of issues with styling in IE6/7.

Finally, the effect is easy to attach to any element on the page with the following piece of code:

<code>window.addEvent('domready', function()
{
  if ($('content_container'))
  {
    var aSnow = new mooSnow({container: $("content_container")});
  }
});
</code>

The only thing to bear in mind is that you will need to have the standard MooTools library code included in your page.