Javascript snow on webpage

 

This animation javascript gives you Snow on your webpage. So now you are sure of a white christmas - at least on the web :-)

The javascript is in one file, named snow.js. The snowweather can be included on your webpages, by simply writing a little piece of code, that gets the javascript snow.js

The script works perfect with theese browsers: Mozilla Firefox 1, Netscape 7 and Internet Explorer 6, and is XHTML 1.0-validated by W3C

Start save the snowflake snow.gif on your webserver:

sne.gif Rightclick on the snowflake, and choose "Save picture as...".
Other snowflakes you can use: snow0.gif snow1.gif snow2.gif snow3.gif snow4.gif snow5.gif snow6.gif snow7.gif snow8.gif snow9.gif

Or other pictures than snow: heart.gif star.gif marguerit.gif

Create a new file, with the name snow.js and save it on your website. The file must have the following content...
REMEMBER: To change the path, where snow.gif is saved...
EXTRA: You can easily adjust the numbers of snowflakes you want on each page...
 
 

Download the file snow.js here: sne.js

////////////////////////////////////////////////////////////////
// Javascript made by Rasmus - http://www.peters1.dk //
////////////////////////////////////////////////////////////////

var SNOW_Picture = "http://www.domain.com/billeder/snow.gif"
var SNOW_no = 15;

var SNOW_browser_IE_NS = (document.body.clientHeight) ? 1 : 0;
var SNOW_browser_MOZ = (self.innerWidth) ? 1 : 0;
var SNOW_browser_IE7 = (document.documentElement.clientHeight) ? 1 : 0;

var SNOW_Time;
var SNOW_dx, SNOW_xp, SNOW_yp;
var SNOW_am, SNOW_stx, SNOW_sty; 
var i, SNOW_Browser_Width, SNOW_Browser_Height;

if (SNOW_browser_IE_NS)
{
	SNOW_Browser_Width = document.body.clientWidth;
	SNOW_Browser_Height = document.body.clientHeight;
}
else if (SNOW_browser_MOZ)
{
	SNOW_Browser_Width = self.innerWidth - 20;
	SNOW_Browser_Height = self.innerHeight;
}
else if (SNOW_browser_IE7)
{
	SNOW_Browser_Width = document.documentElement.clientWidth;
	SNOW_Browser_Height = document.documentElement.clientHeight;
}

SNOW_dx = new Array();
SNOW_xp = new Array();
SNOW_yp = new Array();
SNOW_am = new Array();
SNOW_stx = new Array();
SNOW_sty = new Array();

for (i = 0; i < SNOW_no; ++ i) 
{ 
	SNOW_dx[i] = 0; 
	SNOW_xp[i] = Math.random()*(SNOW_Browser_Width-50);
	SNOW_yp[i] = Math.random()*SNOW_Browser_Height;
	SNOW_am[i] = Math.random()*20; 
	SNOW_stx[i] = 0.02 + Math.random()/10;
	SNOW_sty[i] = 0.7 + Math.random();
	if (i == 0) document.write("<\div id=\"SNOW_flake"+ i +"\" style=\"position: absolute; z-index: "+ i +"; visibility: visible; top: 15px; left: 15px;\"><a href=\"http://www.peters1.dk\" target=\"_blank\"><\img src=\""+SNOW_Picture+"\" border=\"0\"></a><\/div>");
	else document.write("<\div id=\"SNOW_flake"+ i +"\" style=\"position: absolute; z-index: "+ i +"; visibility: visible; top: 15px; left: 15px;\"><\img src=\""+SNOW_Picture+"\" border=\"0\"><\/div>");
}

function SNOW_Weather() 
{ 

for (i = 0; i < SNOW_no; ++ i) 
{ 
	SNOW_yp[i] += SNOW_sty[i];

	if (SNOW_yp[i] > SNOW_Browser_Height-50) 
	{
		SNOW_xp[i] = Math.random()*(SNOW_Browser_Width-SNOW_am[i]-30);
		SNOW_yp[i] = 0;
		SNOW_stx[i] = 0.02 + Math.random()/10;
		SNOW_sty[i] = 0.7 + Math.random();
	}

	SNOW_dx[i] += SNOW_stx[i];

	document.getElementById("SNOW_flake"+i).style.top=SNOW_yp[i]+"px";
	document.getElementById("SNOW_flake"+i).style.left=SNOW_xp[i] + SNOW_am[i]*Math.sin(SNOW_dx[i])+"px";
}

SNOW_Time = setTimeout("SNOW_Weather()", 10);

}

SNOW_Weather(); 

Include this html code right after <body> on the webpages, you wants the snowflakes to appear:
REMEMBER: To change the path to your own placement of the file snow.js

<script type="text/javascript" src="http://www.domain.com/scripts/snow.js"></script>

 

Could You use this script? Please donate a little amount...



...to the development of more scripts :-)
Snevejr på hjemmesiden med Javascript

Javascript snow on webpage

Javascript Schnee und Schneeflocken

Javascript snö på hemsidan

Javascript snø på websiden

Javascript lunta internet-sivulle

Sneeuw op uw website met Javascript

De la neige en JavaScript sur une page web

La neve in Javascript sulla pagina web

Nevando via Javascript na página web.

Skrypt śniegu Javascript na stronie

Javascript Hó effekt a weboldaladon

Ninsoare Javascript pe pagina web

Эффект снега на вашей веб-странице (Javascript)

Denne side på dansk Snevejr på hjemmesiden med Javascript
Diese Seite auf Deutsch Javascript Schnee und Schneeflocken
Denna sida på svenska Javascript snö på hemsidan
Denne siden på norsk Javascript snø på websiden
Sivu suomi Javascript lunta internet-sivulle
Deze pagina in het Nederlands Sneeuw op uw website met Javascript
Cette page en français De la neige en JavaScript sur une page web
Questa pagina in italiano La neve in Javascript sulla pagina web
Esta página em português Nevando via Javascript na página web.
Strona w języku polskim Skrypt śniegu Javascript na stronie
Ez az oldal Magyar Javascript Hó effekt a weboldaladon
Aceasta pagina este in Româneşte Ninsoare Javascript pe pagina web
Эта страница в [russian] Эффект снега на вашей веб-странице (Javascript)
 
Front page Read/sign my guestbook Sitemap Send mail   Bookmark and Share

The latest 5 entries in my guestbook are from:
Portugal Brasil Australia Canada Pilipinas 
Valid XHTML 1.0!