Sternenstaub

Moderator: HTML-Laie

Antworten
Benutzeravatar
Hape
Administrator
Beiträge: 336
Registriert: Fr 22. Mai 2020, 00:33

Sternenstaub

Beitrag von Hape »

Code: Alles auswählen

<script type="text/javascript">
<!--
var Stern = 25;

var browser_IE_NS = (document.body.clientHeight) ? 1 : 0;
var browser_MOZ = (self.innerWidth) ? 1 : 0;

var Zeit;
var Stern_dx, Stern_xp, Stern_yp;
var Stern_am, Stern_stx, Stern_sty;
var i, Stern_Browser_Breite, Stern_Browser_Hoehe;

if (browser_IE_NS){
Stern_Browser_Breite = document.body.clientWidth;
Stern_Browser_Hoehe = document.body.clientHeight;
}
else if (browser_MOZ){
Stern_Browser_Breite = self.innerWidth - 20;
Stern_Browser_Hoehe = self.innerHeight;
}

Stern_dx = new Array(); Stern_xp = new Array(); Stern_yp = new Array();
Stern_am = new Array(); Stern_stx = new Array(); Stern_sty = new Array();

for (i = 0; i < Stern; ++ i) {
Stern_dx[i] = 0;
Stern_xp[i] = Math.random()*(Stern_Browser_Breite-50);
Stern_yp[i] = Math.random()*Stern_Browser_Hoehe;
Stern_am[i] = Math.random()*20;
Stern_stx[i] = 0.02 + Math.random()/10;
Stern_sty[i] = 0.7 + Math.random();
var Stern_Bild = (i % 2) ? "stern.gif" : "stern2.gif";
document.write("<\div id=\"Sternstaub"+ i +"\" ");
document.write("style=\"position: absolute; z-index: "+ i +"; visibility: visible;\">");
document.write("<\img src=\""+Stern_Bild+"\" border=\"0\"><\/div>");
}

function Sternenstaub() {
for (i = 0; i < Stern; ++ i) {
Stern_yp[i] += Stern_sty[i];
if (Stern_yp[i] > Stern_Browser_Hoehe-50) {
Stern_xp[i] = Math.random()*(Stern_Browser_Breite-Stern_am[i]-30);
Stern_yp[i] = 0;
Stern_stx[i] = 0.02 + Math.random()/10;
Stern_sty[i] = 0.7 + Math.random();
}

Stern_dx[i] += Stern_stx[i];

document.getElementById("Sternstaub"+i).style.top=Stern_yp[i]+"px";
document.getElementById("Sternstaub"+i).
style.left=Stern_xp[i] + Stern_am[i]*Math.sin(Stern_dx[i])+"px";
}

Zeit = setTimeout("Sternenstaub()", 10);

}
Sternenstaub();
//-->
</script>
Demoseite: https://hapes-javascript-demo-page.hpag ... staub.html
stern.gif
stern.gif (215 Bytes) 4452 mal betrachtet
stern2.gif
stern2.gif (215 Bytes) 5176 mal betrachtet

Antworten