- A girl should be two things: classy and fabulous

Julkalender - lucka 16

DATUM: 2011-12-16 TID: 06:48:00
KATEGORIER: Julkalendern - 2011;

Tänkte ha lite designtips här på bloggen igen : ) Idag blir det hur man får en lite mer "julig" blogg. Självklart blir det snöflingor! Jag har det på bloggen, och visst känner man sig lite mer julinspirerad?

Det är inte alls svårt, det är bara en ganska lång kod...

1. Gå in i kodmallarna. Leta upp avsnittet som heter "head". Strax innan "body".

2. Kopiera koden som finns neda. Placera den över avnsittet "head".

<script type="text/javascript">

Width =1000; // Bredden som det ska snöas på

Height =2000; // Höjden som det ska snöas på

Count =25; // Antal snöflingor (jag har 40)

MaxStep=3; // Max steg i rörelsen

MinStep=1; // Min steg i rörelsen

MaxFlake=10; // Max storlek på snöflingorna

MinFlake=4; // Min storlek på snöflingorna

PosX = new Array();

PosY = new Array();

StepX = new Array();

StepY = new Array();

StarSize=new Array();

for (i = 0; i < Count; i++) {

PosX[i] = Math.random()*Width;

PosY[i] = Math.random()*Height;

StepX[i] =MinStep+Math.random()* -MaxStep;

StepY[i] =MinStep+Math.random()* MaxStep;

StarSize[i]=MinFlake+Math.random() * MaxFlake;

document.write("<div id='Obj" + i + "' style='position:absolute; left:0px; top:-20px; z-index:10000; visibility:hidden; color:#fff; font-weight:normal; font-family:Verdana; font-size:"+StarSize[i]+"pt'>•</div>");

}

function animate() {

for (i = 0; i < Count; i++) {

PosY[i] += StepY[i];

PosX[i] += StepX[i];

document.getElementById("Obj"+i).style.visibility = "visible";

if (PosY[i] > Width || PosX[i] > Height || PosX[i]<0) { // starta om från toppen av sidan när mitten nås

PosX[i] = Math.random()*Width; ///2

PosY[i] = -20;

StepX[i] = MinStep+Math.random()* -MaxStep;

StepY[i] = MinStep+Math.random()* MaxStep;

}

document.getElementById("Obj"+i).style.top = PosY[i] + "px";

document.getElementById("Obj"+i).style.left = PosX[i] + "px";

}

setTimeout("animate()", 50);// Hastighet

}

setTimeout("animate()", 1000);

</script>

3. Sedan var det klart!! :D

Kommentarer

Trackback