Sternenhimmel (2)

Moderator: HTML-Laie

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

Sternenhimmel (2)

Beitrag von Hape »

Vorbeifliegende Sterne.

CSS-Code:

Code: Alles auswählen

<style type="text/css">

#sDiv0, #sDiv1, #sDiv2, #sDiv3, #sDiv4, #sDiv5, #sDiv6, #sDiv7, #sDiv8, #sDiv9
{
position:absolute; height:1; width:1; font-family:arial black; font-size:9px; color:#FFFFAA; z-index:10;
}
</style>
Script:

Code: Alles auswählen

<SCRIPT LANGUAGE="JavaScript1.2">
<!--

/*
Document firework script (By Matt Gabbert, mgabbert@usrtoday.com, http://www.nolag.com)
*/

var ns=(document.layers);
var ie=(document.all);
var w3=(document.getElementById && self.innerWidth && (window.pageXOffset>-1));
//my way of making sure the browser will have what I need

var allDivs      = new Array(10);
var documentWidth,documentHeight;

function initAll(){
  if(!ns && !ie && !w3)  return;

  for(dNum=0; dNum<10; ++dNum){
    if(ie)    allDivs[dNum]=eval('document.all.sDiv'+dNum+'.style');
    else if(ns)  allDivs[dNum]=eval('document.layers["sDiv'+dNum+'"]');
    else if(w3)  allDivs[dNum]=eval('document.getElementById("sDiv'+dNum+'").style');
    moveTo(dNum,0,0);
  }
}

function moveTo(i,tempx,tempy){
  if (ie){
    documentWidth  =document.body.offsetWidth+document.body.scrollLeft-20;
    randomy=Math.floor(Math.random()*document.body.offsetHeight)+document.body.scrollTop-20;
  }
  else if (ns){
    documentWidth=window.innerWidth+window.pageXOffset-20;
    randomy=Math.floor(Math.random()*window.innerHeight)+window.pageYOffset-20;
  }
  else if (w3){
    documentWidth=self.innerWidth+window.pageXOffset-20;
    randomy=Math.floor(Math.random()*self.innerHeight)+window.pageYOffset-20;
  }

  if(tempx>-50){
    tempx-=45;
    allDivs[i].left=tempx;
    allDivs[i].top =tempy;
    setTimeout("moveTo("+i+","+tempx+","+tempy+")",250)
  }
  else
    setTimeout("moveTo("+i+",documentWidth-10,randomy)",2000/i+40);
}

window.onload=initAll
//End-->
</script>

Code: Alles auswählen

<div id="sDiv0"><img src="/stern.gif"></div>
<div id="sDiv1"><img src="/stern2.gif"></div>
<div id="sDiv2"><img src="/stern.gif"></div>
<div id="sDiv3"><img src="/stern2.gif"></div>
<div id="sDiv4"><img src="/stern.gif"></div>
<div id="sDiv5"><img src="/stern2.gif"></div>
<div id="sDiv6"><img src="/stern.gif"></div>
<div id="sDiv7"><img src="/stern2.gif"></div>
<div id="sDiv8"><img src="/stern.gif"></div>
<div id="sDiv9"><img src="/stern2.gif"></div>
Demoseite dazu: https://hapes-javascript-demo-page.hpag ... mmel2.html
Dateianhänge
stern2.gif
stern2.gif (215 Bytes) 5238 mal betrachtet
stern.gif
stern.gif (215 Bytes) 5238 mal betrachtet

Antworten