nicht angemeldet
schneeflockenscript optimieren
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
-
Ich habs nicht ganz durchgesehen, aber das könnte das Problem sein.
erzeugt für jede Schneeflocke (*-Textnode) eine eigene Funktion
Ruf eine Funktion alle paar ms auf und in der läufst du dann alle Flocken durch. Sowas ähnliches hab ich auch schon gemacht, ist schon ne Weile her => ältere Rechner. Und da liefts auch schon gut.
-
Hallo,
Ruf eine Funktion alle paar ms auf und in der läufst du dann alle Flocken durch. Sowas ähnliches hab ich auch schon gemacht, ist schon ne Weile her => ältere Rechner. Und da liefts auch schon gut.
Ist vielleicht besser, als 70 mal die gleiche Funktion aufzurufen (pro Flocke, ca 700/10 weil alle 10 pixel ein Flocke) die sich dann wieder alle 10 Millisekunden aktualisiert).
Eine Funktion läuft alle 10 Millisekunden alle 70 Knoten durch und schiebt sie ein bisschen weiter statt 70 parallele Instanzen einer Funktion, was wohl das selbe ist wie 70 namentlich verschiedene Funktionen.
Gruß
jobo
-
Eine Funktion läuft alle 10 Millisekunden alle 70 Knoten durch und schiebt sie ein bisschen weiter statt 70 parallele Instanzen einer Funktion, was wohl das selbe ist wie 70 namentlich verschiedene Funktionen.
Ja das ist schon besser. Du hast die ganze Aufruferei nicht und es ist leicht an eine andere Anzahl an Flocken anpassbar. Vielleicht spielst du noch ein bisschen mit der Zeit rum, ich denke das reicht auch wenn du es nicht so oft machst, das ist immer noch 100 mal pro Sekunde. Die meisten Bildschirme werden das gar nicht so oft anzeigen ;-)
Und denk auch an etwas langsamere Rechner. Es ist ziemlich disqualifizierend für ne Webseite, wenn sie den ganzen Rechner runterzieht.
-
-
Hi!
Ruf eine Funktion alle paar ms auf und in der läufst du dann alle Flocken durch.
Mit dem Ergebnis, dass alle Flocken schön synchron zueinander fallen. Das ist ja auch viel besser als so ein unabgestimmtes Herumgewusel. :-)
Mal im Ernst (auch wenn ich eigentlich dafür bin, solche Scripte auf <script></script> zu kürzen): Den Zufall sollte man schon noch ein wenig berücksichtigen. Mir fällt da ein:
- Ob eine Flocke bewegt werden soll oder nicht, muss ein Zufallswert bestimmen.
- Geringfügig kann man das optimieren, indem man die Flocken gruppiert, z.B. 10 Flocken für einmal Zufall berechnen. Aber allzuviel bringt das sicher nicht.
- Aber das Gruppieren kann auf den ursprünglichen Ansatz angewendet werden, wenn man das Prinzip nicht großartig ändern will.
Lo!
-
Hallo,
Hi!
Ruf eine Funktion alle paar ms auf und in der läufst du dann alle Flocken durch.
Mit dem Ergebnis, dass alle Flocken schön synchron zueinander fallen. Das ist ja auch viel besser als so ein unabgestimmtes Herumgewusel. :-)
Mal im Ernst (auch wenn ich eigentlich dafür bin, solche Scripte auf <script></script> zu kürzen)
Es ist kein Praxisscript. Es ist ein Programmierbeispiel für die Computer/HTMl-Ag, die ich ehreamtlich leite (;-). Das war ein "Geschenk" an die Schüler. Abgesehen davon gibt es auch mit einer Lehrerin Gespräche, wie Kinder/Jugendliche an Programmiersprache führen. Javascript ist da schon eine Alternative zu Delphi.
- Ob eine Flocke bewegt werden soll oder nicht, muss ein Zufallswert bestimmen.
Eigentlich eher nicht. Wann sie losfällt schon. Das habe ich ja mit setTimeout zu Start des Fallens gemacht. Wenn sie fällt, dann fällt sie. Das Fallen ist ja auch keine großartige Berechnungn. Aber dass am Ende etwa 70 Flocken überhaupt alle 10 Millisekunden bewegt werden, das bringt den Compi wohl in die Knie.
Fein strukturiert ist es ja jetzt (objektorientiert), https://forum.selfhtml.org/?t=193464&m=1292322 (bzw. zur Ansicht)
Gruß
jobo
-
Hi!
- Ob eine Flocke bewegt werden soll oder nicht, muss ein Zufallswert bestimmen.
Eigentlich eher nicht. Wann sie losfällt schon. Das habe ich ja mit setTimeout zu Start des Fallens gemacht. Wenn sie fällt, dann fällt sie. Das Fallen ist ja auch keine großartige Berechnungn.
Naja, sie darf nicht über längere Zeit stehenbleiben, aber sie alle synchron zueinander zu bewegen, stell ich mir auch nicht sehr toll vor. Vor allem, wenn man aus Performancegründen die Wiederholrate herunter nehmen muss.
Lo!
-
Hallo,
Naja, sie darf nicht über längere Zeit stehenbleiben, aber sie alle synchron zueinander zu bewegen, stell ich mir auch nicht sehr toll vor. Vor allem, wenn man aus Performancegründen die Wiederholrate herunter nehmen muss.
Da sie ja per Zufallsgenerator starten, bewegen sie sich alle zu unterschiedlichen Zeiten. Vom "Look" her finde ich es ja o.k.. Auf meinem 3 Jahre alten Medion-Laptop läufts auch ganz rund. Je mehr Flocken, desto langsamer. Aber das sieht nachher richtig gemütlich aus (;-).
Gruß
jobo
-
Hi!
Da sie ja per Zufallsgenerator starten, bewegen sie sich alle zu unterschiedlichen Zeiten.
Ja, wenn du für jede Flocke eine eigene Funktion mit eigenen Timer aufrufen lässt. Aber der Vorschlag war ja, eine Funktion zu verwenden, die alle Flocken bewegt. Dann bekommst du ein Flockensynchronschwimmen.
Vom "Look" her finde ich es ja o.k..
Naja, sie eiern ziemlich. Sie bewegen sich nur minimal und zu gleichmäßig nach links und rechts. Lass sie mehr tanzen.
Lo!
-
- Ob eine Flocke bewegt werden soll oder nicht, muss ein Zufallswert bestimmen.
-
-
[latex]Mae govannen![/latex]
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";[usw.]
Hier muß bei jedem einzelnen(!) Aufruf das window-Objekt nach der entsprechenden Eigenschaft durchsucht werden, wobei es ohnehin schleierhaft ist, weshalb alles ans windows-Objekt gehängt wir und weshalb durchgängig globale Variablen verwendet werden.
Wie kann man das ganze optimieren, oder geht das garnicht?
Äh, die Frage wäre eher, was man an diesem Script _nicht_ optimieren könnte >:->
Wäre es schlau, eine Klasse zu bauen, mit eingebauter snow-Funktion?
Klassen kennt Javascript nicht, nur Objekte. Aber ein objektorientierter Ansatz würde dem Script sicherlich gut tun.
Oder die Sinusberechnung (horizentale Auslenkung) vorzuberechnen und in einem Array zu speichern?
Bei einer überschaubaren Anzahl von Werten durchaus. Ich hab mir das Script noch nicht näher angeschaut, daher weiß ich nicht genau, wie viele Werte hier sind, aber man könnte natürlich die sinus-Berechnungen einmalig machen und dann für jede Flocke das Array an einem jeweils zufälligen Wert anspringen und bei Update den nächsten Wert nehmen bzw wieder zum Array-Anfang springen ..
Cü,
Kai
--
Even if you are a master of jQuery, you can only create mediocre (at best)
scripts. The problem is that the authors you rely on have not mastered the
DOM themselves. It's like one blind guy leading another off a cliff (D.Mark/clj)
Foren-Stylesheet Site Selfzeug JS-Lookup
SelfCode: sh:( fo:| ch:? rl:( br:< n4:( ie:{ mo:| va:) js:| de:> zu:) fl:( ss:| ls:?-
Hallo,
Oder die Sinusberechnung (horizentale Auslenkung) vorzuberechnen und in einem Array zu speichern?
Bei einer überschaubaren Anzahl von Werten durchaus. Ich hab mir das Script noch nicht näher angeschaut, daher weiß ich nicht genau, wie viele Werte hier sind, aber man könnte natürlich die sinus-Berechnungen einmalig machen und dann für jede Flocke das Array an einem jeweils zufälligen Wert anspringen und bei Update den nächsten Wert nehmen bzw wieder zum Array-Anfang springen ..
An der Anzahl und der Zeit kann ich so oder so rumkonfigurieren. Mit ner Sinus Tabelle gehts auch nicht schneller: <!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] sinusTable = new Array; createSinusTable = function () { for (k=-30;k<screen.height;k++) { sinusTable[k] = 2*Math.sin(k/5); } }; window.onload = function() { javascript: createSinusTable(); 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] + sinusTable[window["y"+j]] + "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) ; }</script>
</head>
<body>
</body>
</html>[/code]
Grußjobo
-
Hallo,
Wäre es schlau, eine Klasse zu bauen, mit eingebauter snow-Funktion?
Klassen kennt Javascript nicht, nur Objekte. Aber ein objektorientierter Ansatz würde dem Script sicherlich gut tun.
Oder die Sinusberechnung (horizentale Auslenkung) vorzuberechnen und in einem Array zu speichern?
<!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] sinusTable = new Array; createSinusTable = function () { for (k=-30;k<screen.height;k++) { sinusTable[k] = 2*Math.sin(k/5); } }; Snowflake = function (xPosition) { this.star=document.createTextNode("*"); /*put it in surrounding div, whiten it and append*/ this.div=document.createElement("div"); this.div.appendChild(this.star); this.div.style.color="#fff"; DB.appendChild(this.div); /* size and base-position and store for each snowflake*/ this.fontSize = Math.ceil(Math.random()*40); this.div.style.fontSize=this.fontSize + "px"; this.div.style.position="absolute"; this.yPos=-this.fontSize; this.xPos = xPosition; this.div.style.left=10 + this.xPos + "px"; this.div.style.top= this.yPos+"px"; }; fall = function(j) { if (mySnowflakes[j].yPos < myMarginBottom) { mySnowflakes[j].yPos += myPixelsPerStep; /* new postition, down and left/right for little sinus-swing*/ mySnowflakes[j].div.style.top = mySnowflakes[j].yPos + "px"; mySnowflakes[j].div.style.left = mySnowflakes[j].xPos + sinusTable[mySnowflakes[j].yPos] + "px"; } else { mySnowflakes[j].yPos=-mySnowflakes[j].fontSize; } /* to call in setTimeout-function, will be e.g. window[snow40](40)*/ setTimeout("fall("+j+")",myTimeout); }; window.onload = function() { javascript: createSinusTable(); DB=document.body; DB.style.backgroundColor = "#000"; myStartMarginLeft = 40; myDistanceBetweenFlakes = 10; /* stop before bottom of window*/ myMarginBottom = screen.height - 150; /* pixels to move for each step;*/ myPixelsPerStep = 1; /* speed in msec*/ myTimeout = 10; /* walk from left margin to end of screen*/ mySnowflakes = new Array; for (i = myStartMarginLeft; i< screen.width; i += myDistanceBetweenFlakes) { /*make a snowchristal*/ mySnowflakes[i] = new Snowflake(i); functionCallNow = 'fall('+i+')'; /* start random*/ setTimeout(functionCallNow,Math.random()*50000); } void(0) ; }</script>
</head>
<body>
</body>
</html>
[/code]Wie aber kriege ich die Funktion "fall()" als Methode des Objekts?
Gruß
jobo
-
Hallo,
closure natürlich. Leider gehts jetzt nicht in der Browserzeile so. Sagt er, sinusTable[_self.yPos] wäre nicht definiert, was scheinbar heißt, dass er das "_self", den closure, vergisst?
<!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] javascript: sinusTable = new Array; createSinusTable = function () { for (k=-30;k<screen.height;k++) { sinusTable[k] = 2*Math.sin(k/5); } }; Snowflake = function (xPosition) { this.star=document.createTextNode("*"); /*put it in surrounding div, whiten it and append*/ this.div=document.createElement("div"); this.div.appendChild(this.star); this.div.style.color="#fff"; DB.appendChild(this.div); /* size and base-position and store for each snowflake*/ this.fontSize = Math.ceil(Math.random()*40); this.div.style.fontSize=this.fontSize + "px"; this.div.style.position="absolute"; this.yPos=-this.fontSize; this.xPos = xPosition; this.div.style.left=10 + this.xPos + "px"; this.div.style.top= this.yPos+"px"; /* closure - capture/close this in private var*/ var _self = this; this.fall = function(j) { if (_self.yPos < myMarginBottom) { _self.yPos += myPixelsPerStep; /* new postition, down and left/right for little sinus-swing*/ _self.div.style.top = _self.yPos + "px"; _self.div.style.left = _self.xPos + sinusTable[_self.yPos] + "px"; } else { _self.yPos=-_self.fontSize; } /* to call in setTimeout-function, will be e.g. window[snow40](40)*/ setTimeout(_self.fall,myTimeout); }; }; window.onload = function() { createSinusTable(); DB=document.body; DB.style.backgroundColor = "#000"; myStartMarginLeft = 40; myDistanceBetweenFlakes = 10; /* stop before bottom of window*/ myMarginBottom = screen.height - 150; /* pixels to move for each step;*/ myPixelsPerStep = 1; /* speed in msec*/ myTimeout = 10; /* walk from left margin to end of screen*/ mySnowflakes = new Array; for (i = myStartMarginLeft; i< screen.width; i += myDistanceBetweenFlakes) { /*make a snowchristal*/ mySnowflakes[i] = new Snowflake(i); functionCallNow = 'mySnowflakes['+i+'].fall()'; /* start random*/ setTimeout(functionCallNow,Math.random()*50000); } }; void(0) ;</script>
</head>
<body>
</body>
</html>
[/code]Gruß
jobo
-
Hallo,
Hallo,
closure natürlich. Leider gehts jetzt nicht in der Browserzeile so. Sagt er, sinusTable[_self.yPos] wäre nicht definiert, was scheinbar heißt, dass er das "_self", den closure, vergisst?
Falsch. window.onload() existiert in der Adresszeile nicht. Also:
javascript:sinusTable = new Array;createSinusTable = function () {for (k=-30;k<screen.height;k++) {sinusTable[k] = 2*Math.sin(k/5);}};Snowflake = function (xPosition) {this.star=document.createTextNode("*");/*put it in surrounding div, whiten it and append*/this.div=document.createElement("div");this.div.appendChild(this.star);this.div.style.color="#fff";DB.appendChild(this.div);/* size and base-position and store for each snowflake*/this.fontSize = Math.ceil(Math.random()*40);this.div.style.fontSize=this.fontSize + "px";this.div.style.position="absolute";this.yPos=-this.fontSize;this.xPos = xPosition;this.div.style.left=10 + this.xPos + "px";this.div.style.top= this.yPos+"px";/* closure - capture/close this in private var*/var _self = this;this.fall = function(j) {if (_self.yPos < myMarginBottom) {_self.yPos += myPixelsPerStep;/* new postition, down and left/right for little sinus-swing*/_self.div.style.top = _self.yPos + "px";_self.div.style.left = _self.xPos + sinusTable[_self.yPos] + "px";} else {_self.yPos=-_self.fontSize;}/* to call in setTimeout-function, will be e.g. window[snow40](40)*/setTimeout(_self.fall,myTimeout);};};createSinusTable();DB=document.body;DB.style.backgroundColor = "#000";myStartMarginLeft = 40;myDistanceBetweenFlakes = 10;/* stop before bottom of window*/myMarginBottom = screen.height - 150;/* pixels to move for each step;*/myPixelsPerStep = 1;/* speed in msec*/myTimeout = 10;/* walk from left margin to end of screen*/mySnowflakes = new Array;for (i = myStartMarginLeft; i< screen.width; i += myDistanceBetweenFlakes) {/*make a snowchristal*/mySnowflakes[i] = new Snowflake(i);functionCallNow = 'mySnowflakes['+i+'].fall()';/* start random*/setTimeout(functionCallNow,Math.random()*50000);}void(0)zum fröhlichen Kopieren in die Adresszeile.
Grußjobo
-
-
-