Hallo,
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
</head>
<script type="text/javascript">
[code lang=javascript]
window.onload = function() {
javascript:
DB=document.body;
DB.style.backgroundColor = "#000";
myStartMarginLeft = 40;
myDistanceBetweenFlakes = 10;
myFontSize = new Array;
/* walk from left margin to end of screen*/
for (i = myStartMarginLeft; i< screen.width; i += myDistanceBetweenFlakes) {
/*make a snowchristal*/
window["star"+i]=document.createTextNode("*");
/*put it in surrounding div, whiten it and append*/
window["div"+i]=document.createElement("div");
window["div"+i].appendChild(window["star"+i]);
window["div"+i].style.color="#fff";
DB.appendChild(window["div"+i]);
/* size and base-position and store for each snowflake*/
myFontSize[i] = Math.ceil(Math.random()*40);
window["div"+i].style.fontSize=myFontSize[i] + "px";
window["div"+i].style.position="absolute";
window["y"+i]=-myFontSize[i];
window["x"+i] = i;
window["div"+i].style.left=10 + window["x"+i] + "px";
window["div"+i].style.top= window["y"+i]+"px";
/* stop before bottom of window*/
myMarginBottom = screen.height - 150;
/* pixels to move for each step;*/
myPixelsPerStep = 1;
/* speed in msec*/
myTimeout = 10;
/* make for each snowflake a seperate snow-function*/
window["snow"+i] = function (j) {
if (window["y"+j] < myMarginBottom) {
window["y"+j] += myPixelsPerStep;
/* new postition, down and left/right for little sinus-swing*/
window["div"+j].style.top = window["y"+j] + "px";
window["div"+j].style.left = window["x"+j] + 2*Math.sin(window["y"+j]/5) + "px";
} else {
window["y"+j]=myFontSize[j];
}
/* to call in setTimeout-function, will be e.g. window[snow40](40)*/
functionCall = 'window["snow'+j+'"]('+j+')';
setTimeout(functionCall,myTimeout);
};
/* call the just defined function*/
functionCallNow = 'window["snow'+i+'"]('+i+')';
/* start random*/
setTimeout(functionCallNow,Math.random()*50000);
}
void(0)
;
}
</script>
</head>
<body>
</body>
</html>
[/code]
erzeugt für jede Schneeflocke (*-Textnode) eine eigene Funktion (window"snow40") zB.. Es läuft aber rattenlahm.
mit
window.onload = function() {
javascript:
DB=document.body;
DB.style.backgroundColor = "#000";
/* make one function to calculate the way of each snowflake*/
snow = function (j) {
if (window["y"+j] < myMarginBottom) {
window["y"+j] += myPixelsPerStep;
/* new postition, down and left/right for little sinus-swing*/
window["div"+j].style.top = window["y"+j] + "px";
window["div"+j].style.left = window["x"+j] + 2*Math.sin(window["y"+j]/5) + "px";
} else {
window["y"+j]=myFontSize[j];
}
/* to call in setTimeout-function, will be e.g. window[snow40](40)*/
functionCall = 'snow('+j+')';
setTimeout(functionCall,myTimeout);
};
myStartMarginLeft = 40;
myDistanceBetweenFlakes = 10;
myFontSize = new Array;
/* walk from left margin to end of screen*/
for (i = myStartMarginLeft; i< screen.width; i += myDistanceBetweenFlakes) {
/*make a snowchristal*/
window["star"+i]=document.createTextNode("*");
/*put it in surrounding div, whiten it and append*/
window["div"+i]=document.createElement("div");
window["div"+i].appendChild(window["star"+i]);
window["div"+i].style.color="#fff";
DB.appendChild(window["div"+i]);
/* size and base-position and store for each snowflake*/
myFontSize[i] = Math.ceil(Math.random()*40);
window["div"+i].style.fontSize=myFontSize[i] + "px";
window["div"+i].style.position="absolute";
window["y"+i]=-myFontSize[i];
window["x"+i] = i;
window["div"+i].style.left=10 + window["x"+i] + "px";
window["div"+i].style.top= window["y"+i]+"px";
/* stop before bottom of window*/
myMarginBottom = screen.height - 150;
/* pixels to move for each step;*/
myPixelsPerStep = 1;
/* speed in msec*/
myTimeout = 10;
/* call the just defined function*/
functionCallNow = 'snow('+i+')';
/* start random*/
setTimeout(functionCallNow,Math.random()*50000);
}
void(0)
;
}
habe ich nur eine snow-Funktion, aber besser wirds nicht.
Wie kann man das ganze optimieren, oder geht das garnicht? Wäre es schlau, eine Klasse zu bauen, mit eingebauter snow-Funktion? Oder die Sinusberechnung (horizentale Auslenkung) vorzuberechnen und in einem Array zu speichern?
Wenn man von javascript: bis void(0) das in den Arbeitsspeicher kopiert und dann in die Adressleiste kopiert und abschickt, funzt es übrigens:
javascript:DB=document.body;DB.style.backgroundColor = "#000";/* make one function to calculate the way of each snowflake*/snow = function (j) {if (window["y"+j] < myMarginBottom) {window["y"+j] += myPixelsPerStep;/* new postition, down and left/right for little sinus-swing*/window["div"+j].style.top = window["y"+j] + "px";window["div"+j].style.left = window["x"+j] + 2*Math.sin(window["y"+j]/5) + "px";} else {window["y"+j]=myFontSize[j];}/* to call in setTimeout-function, will be e.g. windowsnow40*/functionCall = 'snow('+j+')';setTimeout(functionCall,myTimeout);};myStartMarginLeft = 40;myDistanceBetweenFlakes = 10;myFontSize = new Array;/* walk from left margin to end of screen*/for (i = myStartMarginLeft; i< screen.width; i += myDistanceBetweenFlakes) {/*make a snowchristal*/window["star"+i]=document.createTextNode("*");/*put it in surrounding div, whiten it and append*/window["div"+i]=document.createElement("div");window["div"+i].appendChild(window["star"+i]);window["div"+i].style.color="#fff";DB.appendChild(window["div"+i]);/* size and base-position and store for each snowflake*/myFontSize[i] = Math.ceil(Math.random()*40);window["div"+i].style.fontSize=myFontSize[i] + "px";window["div"+i].style.position="absolute";window["y"+i]=-myFontSize[i];window["x"+i] = i;window["div"+i].style.left=10 + window["x"+i] + "px";window["div"+i].style.top= window["y"+i]+"px";/* stop before bottom of window*/myMarginBottom = screen.height - 150;/* pixels to move for each step;*/myPixelsPerStep = 1;/* speed in msec*/myTimeout = 10;/* call the just defined function*/functionCallNow = 'snow('+i+')';/* start random*/setTimeout(functionCallNow,Math.random()*50000);}void(0)
Deshalb das "void(0)" am Ende und "javascript:" am Anfang sowie die /**/-Kommentar-Variante.
Gruß
jobo