java script snö
Postat: 2005-12-06 00:45
jo undra hur man kan lägga till fallande snö på sidan så de ser ut som de snöar ?
Kod: Markera allt
<HEAD>
<script language="JavaScript">
<!--
Width =[b]800[/b] // ange bredden på sidan som ska snöas in...
Height =[b]600[/b] // ange höjden på sidan som ska snöas in...
Count = [b]50[/b]; // antal snöflingor OBS! ange inte för stort antal!
MaxStep=[b]3[/b] // max steg i rörelsen
MinStep=[b]1[/b] // min steg i rörelsen
MaxFlake=[b]20[/b] // max storlek på snöflinga
MinFlake=[b]5[/b] // min storlek på snöflinga
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
//färg på snöflingor och tecken som används (asterisk * i exemplet)
document.write("<div id='Obj" + i + "' style='position:absolute; left:0; top:0; visibility:hidden; color[b]:#E5E5E5[/b]; font-size:"+StarSize[i]+"'>*</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] > document.body.clientHeight-20||PosX[i] > document.body.clientWidth-20||PosX[i]<0) { // starta om från toppen av sidan när botten nås
PosX[i] = Math.random()*document.body.clientWidth///2
PosY[i] = document.body.scrollTop;
StepX[i] = MinStep+Math.random()* -MaxStep;
StepY[i] = MinStep+Math.random()*MaxStep;
}
document.getElementById("Obj"+i).style.top = PosY[i];
document.getElementById("Obj"+i).style.left = PosX[i]
}
setTimeout("animate()", [b]50[/b]);// hastighet
}
setTimeout("animate()", 1000)
// -->
</script>
</HEAD>http://webdesignskolan.se/javascripts/snow/snow.htm (fungerar dock inte i FireFox)
