Kellemes karácsonyt és havazás JS

Ez úton szeretnénk az Edemmester Gamer Blog nevében kellemes karácsonyi ünnepeket kívánni a WebenWeb blog minden kedves olvasójának. Úgy döntöttünk, hogy valamiféle ajándékot is hozunk nektek, ez volna a mai havazás, amit az oldalsávon kikapcsolhattok.

Akik csak használni szeretnék

Havazás kód:
Ki/be kapcsoló link:

Akik érteni is szeretnék

<style> 

/* Itt következik a hópelyhek alapértelmezett stíluslapja. Ennek néhány paraméterét persze a jövőben majd felülírjuk. */

snowflake
{
display:block;
width:10px;
height:10px;
position:fixed;
top:0px;
left:0px;
font-family:Arial;
font-size:10px;
z-index:9999999;
}
</style>

<script>
snowfall=""; //Ebben a változóban lesz majd az időzítő

snowfallActive=false; //Jelenleg a hóesés KI van kapcsolva

maxsnow=30; //Egyszerre max. 30 hópehely van a képernyőn

colors=new Array("lightblue", "white", "#CEECF5", "#A9BCF5", "#E0E0F8", "#A9D0F5", "#819FF7"); //Ezek a lehetséges hópehelyszínek

snowflakes = new Array(); //Ez lesz a hópelyhek objektumainak tömbje


function moveSnow() //Ez az eljárás mozgatja a hópelyheket
{
createSnow(true); //Létrehozunk új hópelyhet a képernyő tetején (ha lehetséges)

for(i=0;i<snowflakes.length;++i) //Végiglépkedünk az összes létező hópelyhen

{
if(parseInt(snowflakes[i].style.top)>window.innerHeight) //Ha a hópehely elérte a képernyő alját

{
snowflakes[i].parentNode.removeChild(snowflakes[i]); //Akkor töröljük az objektumot

snowflakes.splice(i,1) //És töröljük a tömbből

}
else //Ellenkező esetben
{

snowflakes[i].style.top=parseInt(snowflakes[i].style.top)+Math.floor(Math.random()*3)+1 + "px"; //Véletlenszerűen leljebb helyezzük

if(Math.random()>0.5) //És jobbra vagy balra
{

snowflakes[i].style.left=parseInt(snowflakes[i].style.left) + Math.floor(Math.random()*1) + "px"; //Eltoljuk pár képponttal

}
else
{
snowflakes[i].style.left=parseInt(snowflakes[i].style.left) - Math.floor(Math.random()*1) + "px";
}
}
}
} //Eljárás vége

function createSnow(start) //Hópehely létrehozó eljárás
{

if(snowflakes.length<maxsnow) //HA kevesebb hópelyhünk van mint a maximum
{

var body = document.body; //Lekérjük a dokumentum BODY tagjét

var flake = document.createElement("snowflake"); //Létrehozunk egy hópelyhet

if(start) //Ha a start igaz
{

flake.style.top=Math.floor(Math.random()*25) + "px"; //Akkor az első 25 pixelen,

}
else //Ha hamis, 
{

flake.style.top=Math.floor(Math.random()*window.innerHeight) + "px"; //Akkor pedig az oldalon bármilyen magasan elhelyezzük.

}

flake.style.color=colors[Math.floor(Math.random()*colors.length)]; //A színét beállítjuk egy véletlenszerűre a fent megadottak közül

flake.innerHTML="*"; //A hópehely tartalmát *-ra állítjuk

flake.style.left=Math.floor(Math.random()*(window.innerWidth-10))+"px"; //A hópelyhet a képernyő bal szélétől véletlenszerű távolságra elhelyezzük

flake.style.fontSize=Math.floor(Math.random()*30)+15+"px"; //Véletlenszerűen beállítjuk a szöveg méretét

body.appendChild(flake); //Hozzáfűzzük a body-hoz a hópelyhet

snowflakes.push(flake); //Hozzáadjuk a tömbünkhöz is a hópelyhet
}
}//Eljárás vége

function toggledownfall() //Ki-be kapcsoló eljárás
{

if(snowfallActive) //Ha a hóesés aktív
{

snowfallActive=false; //Akkor az aktivitást jelző változót hamisra állítjuk

clearTimeout(snowfall); //Töröljük az időzítést

for(i=0;i<snowflakes.length;++i) //Végiglépkedünk a hópelyheken
{

snowflakes[i].parentNode.removeChild(snowflakes[i]); //Töröljük az objektumokat

}

snowflakes=new Array(); //majd kiürítjük a tömböt

}
else //Ha a hóesés inaktív
{

snowfallActive=true; //Igazra állítjuk az aktivitást jelző változót

for(i=0;i<maxsnow;++i) //Amennyi a max hópehelyszám, annyiszor
{

createSnow(false); //Meghívjuk a hópehely létrehozását (BÁRHOL a képernyőn, nem csak felül)

}

snowfall=setInterval(moveSnow,50); //Majd beállítjuk az időzítőt

}
} //Eljárás vége

toggledownfall() //Meghívjuk a ki-be kapcsolást

</script>