[JavaScript] Schnee nicht kompatibel

M

MasterVulkan

--> vOlkAn <--
ID: 115097
L
21 April 2006
720
56
Moin.

Wollte heute meine Homepage etwas in Weihnachtsstimmung bringen und halt Schnee reinmachen. Hab dann erstmal gegoogelt, weil ich relativ keine Ahnung von JavaScript habe.

Habe mir jetzt 3 Scripte aus dem Netz geholt... Eines funktioniert nur im IE, das andere nur in Mozilla, das dritte funzt nur im IE, im Mozilla ist oben links eine Flocke, fällt aber nicht.

Hier die Codes:

Code, wo im Mozilla oben links eine Flocke ist. Im IE funktioniert es.

Code: 
<script type='text/javascript'>
<!--
var no = 18; // Anzahl der Schneeflocken
var speed = 25; // Geschwindigkeit -> je kleiner die Zahl, desto schneller
var snowflake = "snow.gif"; 

var dx, xp, yp;    // coordinate and position variables
var am, stx, sty;  // amplitude and step variables
var i, doc_width, doc_height;
doc_width = document.body.clientWidth;
doc_height = 1100; 

dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
for (i = 0; i < no; ++ i) {
	dx[i] = 0;                        // set coordinate variables
	xp[i] = Math.random()*(doc_width-50);  // set position variables
	yp[i] = Math.random()*doc_height;
	am[i] = Math.random()*20;         // set amplitude variables
	stx[i] = 0.02 + Math.random()/10; // set step variables
	sty[i] = 0.7 + Math.random();     // set step variables
	if (i == 0) {
		document.write("<div id=\"schneedot"+ i +"\" style=\"position: ");
		document.write("absolute; z-index: "+ i +"; visibility: ");
		document.write("visible; top: 15px; left: 15px;\"><img src=\"");
		document.write(snowflake + "\" border=\"0\"></div>");
	} else {
		document.write("<div id=\"schneedot"+ i +"\" style=\"position: ");
		document.write("absolute; z-index: "+ i +"; visibility: ");
		document.write("visible; top: 15px; left: 15px;\"><img src=\"");
		document.write(snowflake + "\" border=\"0\"></div>");
   }
}
function snowIE() {  // IE main animation function
	for (i = 0; i < no; ++ i) {  // iterate for every dot
		yp[i] += sty[i];
		if (yp[i] > doc_height-50) {
			xp[i] = Math.random()*(doc_width-am[i]-30);
			yp[i] = 0;
			stx[i] = 0.02 + Math.random()/10;
			sty[i] = 0.7 + Math.random();
		}
		dx[i] += stx[i];
		document.getElementById("schneedot"+i).style.top = yp[i] + "px";
		document.getElementById("schneedot"+i).style.left = (xp[i] + am[i]*Math.sin(dx[i]))  + "px";
	}
	setTimeout("snowIE()", speed);
}
//-->
</script>

Dann hier der Code, der nur im Firefox geht:

Code: 
<script type="text/javascript">
var snowsrc="dhtml_snowfall.gif"

var ns4up = (document.layers) ? 1 : 0;
var ie4up = (document.all) ? 1 : 0;
var ns6up = (document.getElementById&&!document.all) ? 1 : 0;

var dx, xp, yp;
var am, stx, sty;
var i, doc_width = 800, doc_height = 600;

if (ns4up||ns6up)
  {
  doc_width = self.innerWidth;
  doc_height = self.innerHeight;
  }
else if (ie4up)
  {
  doc_width = document.body.clientWidth;
  doc_height = document.body.clientHeight;
}
var anzahlF
// abhaengig von angezeigter Bildschirmgroesse:
anzahlF = doc_width*doc_height/30000
// alternativ: feste Anzahl
// anzahlF = 100
var no = anzahlF

dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();

for (i = 0; i < no; ++ i)

  {  
  dx[i] = 0;
  xp[i] = Math.random()*(doc_width-50);
  yp[i] = Math.random()*doc_height;
  am[i] = Math.random()*20;
  stx[i] = 0.02 + Math.random()/10;
  sty[i] = 0.7 + Math.random();
  if (ns4up)
    {
    if (i == 0)
      {
      document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\"><a href=\"https://www.volkan91.de.vu/\"><img src='"+snowsrc+"' border=\"0\"></a></layer>");
      }
    else
      {
      document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\"><img src='"+snowsrc+"' border=\"0\"></layer>");
      }
    }
  else if (ie4up||ns6up)
    {
    if (i == 0)
      {
      document.write("<div id=\"dot"+ i +"\" style=\"position: absolute; z-index: "+ i +"; visibility: visible; top: 15px; left: 15px;\"><a href=\"https://www.volkan91.de.vu\"><img src='"+snowsrc+"' border=\"0\"></a></div>");
      }
    else
      {
      document.write("<div id=\"dot"+ i +"\" style=\"position: absolute; z-index: "+ i +"; visibility: visible; top: 15px; left: 15px;\"><img src='"+snowsrc+"' border=\"0\"></div>");
      }
    }
  }

function snowNS()
  {
  for (i = 0; i < no; ++ i)
    {
    yp[i] += sty[i];
    if (yp[i] > doc_height-50)
      {
      xp[i] = Math.random()*(doc_width-am[i]-30);
      yp[i] = 0;
      stx[i] = 0.02 + Math.random()/10;
      sty[i] = 0.7 + Math.random();
      doc_width = self.innerWidth;
      doc_height = self.innerHeight;
      }
    dx[i] += stx[i];
    document.layers["dot"+i].top = yp[i];
    document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);
    }
  setTimeout("snowNS()", 10);
  }

function snowIE_NS6()
  {
  hscrll = (document.layers) ? window.pageYOffset : document.body.scrollTop;
  wscrll = (document.layers) ? window.pageXOffset : document.body.scrollLeft;
  for (i = 0; i < no; ++ i)
    {
    yp[i] += sty[i];
    if (yp[i] > doc_height-50)
      {
      xp[i] = Math.random()*(doc_width-am[i]-30);
      yp[i] = 0;
      stx[i] = 0.02 + Math.random()/10;
      sty[i] = 0.7 + Math.random();
      doc_width = ns6up?window.innerWidth : document.body.clientWidth;
      doc_height = ns6up?window.innerHeight : document.body.clientHeight;
      }
    dx[i] += stx[i];
    if (ie4up)
      {
      document.all["dot"+i].style.pixelTop = yp[i]+hscrll;
      document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i])+wscrll;
      }
    else if (ns6up)
      {
      document.getElementById("dot"+i).style.top=yp[i]+hscrll;
      document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+wscrll;
      }   
    }
    setTimeout("snowIE_NS6()", 10);
  }

if (ns4up)
  {
  snowNS();
  }
else if (ie4up||ns6up)
  {
  snowIE_NS6();
  }
  </script>

Zuletzt der, der nur mit dem IE funktioniert:

Code: 
<SCRIPT LANGUAGE="JavaScript1.2">
<!-- Begin
var no = 25; // snow number
var speed = 10; // smaller number moves the snow faster
var snowflake = "snow.gif";

var ns4up = (document.layers) ? 1 : 0;  // browser sniffer
var ie4up = (document.all) ? 1 : 0;
var dx, xp, yp;    // coordinate and position variables
var am, stx, sty;  // amplitude and step variables
var i, doc_width = 800, doc_height = 600;
if (ns4up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight;
} else if (ie4up) {
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
for (i = 0; i < no; ++ i) {  
dx[i] = 0;                        // set coordinate variables
xp[i] = Math.random()*(doc_width-50);  // set position variables
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20;         // set amplitude variables
stx[i] = 0.02 + Math.random()/10; // set step variables
sty[i] = 0.7 + Math.random();     // set step variables
if (ns4up) {                      // set layers
if (i == 0) {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
document.write("top=\"15\" visibility=\"show\"><img src=\"");
document.write(snowflake + "\" border=\"0\"></layer>");
} else {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
document.write("top=\"15\" visibility=\"show\"><img src=\"");
document.write(snowflake + "\" border=\"0\"></layer>");
   }
} else if (ie4up) {
if (i == 0) {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
document.write(snowflake + "\" border=\"0\"></div>");
} else {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
document.write(snowflake + "\" border=\"0\"></div>");
      }
   }
}
function snowNS() {  // Netscape main animation function
for (i = 0; i < no; ++ i) {  // iterate for every dot
yp[i] += sty[i];
if (yp[i] > doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
dx[i] += stx[i];
document.layers["dot"+i].top = yp[i];
document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);
}
setTimeout("snowNS()", speed);
}
function snowIE() {  // IE main animation function
for (i = 0; i < no; ++ i) {  // iterate for every dot
yp[i] += sty[i];
if (yp[i] > doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dx[i] += stx[i];
document.all["dot"+i].style.pixelTop = yp[i];
document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);
}
setTimeout("snowIE()", speed);
}
if (ns4up) {
snowNS();
} else if (ie4up) {
snowIE();
}
// End -->
</script>

Wie schaffe ich es, dass ich eines der Scripte mit beiden Browsern kompatibel mache?
Oder müsste ich das mit PHP, durch If lösen? If browser Mozilla -> Script 1, sonst 2 oder so?
 
Ein Kommentar, der zwar nix zum Thema beiträgt, aber der trotzdem raus muss:
Wenn ich auf so ne Schnee-Seite komm, is die schneller zu, als sie fertig laden kann. Alles, was diese Dinger machen, is Prozessorleistung beanspruchen, weil dauernd n Timer läuft :evil:
 
theHacker schrieb:
Ein Kommentar, der zwar nix zum Thema beiträgt, aber der trotzdem raus muss:
Wenn ich auf so ne Schnee-Seite komm, is die schneller zu, als sie fertig laden kann. Alles, was diese Dinger machen, is Prozessorleistung beanspruchen, weil dauernd n Timer läuft :evil:
Zum Vergrößern anklicken....

Stimmt schon... Aber freu dich, auf meine Seite gehst du eh niemals :)
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben