Javascript läuft auf IE, nicht auf Firefox !

[Thomas]

Hallo !

Zur Feier des Tages hab ich mir gedacht (da es heute zum ersten Mal hier schneit), bau ich ein Schnee-Script in mein Forum ein.

Bitte keine Belehrungen, das Script kann jeder in seinen Foreneinstellungen an- und abschalten !

Jetzt ist mein einziges Problem, das der Programmcode, und zwar dieser hier:

var no = 25;                   // number of snowflakes
var speed = 10;                // the smaler, the faster snowflakes
var snowflake = "snow.gif";    // picture source
var ns4b = (document.layers) ? 1 : 0;   // Netscape4.x
var b4up = (document.all) ? 1 : 0;      // MSIE4, Opera5, Netccape5
var dx, xp, yp;                // coordinate and position variables
var am, stx, sty;              // amplitude and step variables
var snowobj;
var i, doc_width = 800, doc_height = 600;

if (ns4b) {
   doc_width  = self.innerWidth;
   doc_height = self.innerHeight;
} else if (b4up) {
   doc_width  = document.body.clientWidth;
   doc_height = document.body.clientHeight;
} else {
   b4up = 1;                   // 800x600 screen-default
}// if

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

for (i=0; i<no; ++i) {         // iterate for every snowflake
   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 (ns4b) {                           // set layers
      document.write("<LAYER NAME="flake"+ i +"" LEFT="15" "
      + "TOP="15" VISIBILITY="show"><IMG SRC=""
      + snowflake +"" BORDER=0></LAYER>");
   } else if (b4up) {
      document.write("<DIV ID="flake"+ i +"" STYLE=""
      + "position:absolute; z-index:"+ i +"; visibility:visible; "
      + "top:15px; left:15px;"><IMG SRC=""+ snowflake
      + "" BORDER=0></DIV>");
      snowobj[i] = eval (document.getElementById("flake"+i).style);
   }//if
}//for

function snowNS() {            // Netscape4 main animation function
   for (i=0; i<no; ++i) {      // iterate for every snowflake
      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();
      }//if
         dx[i] += stx[i];
         document.layers["flake"+i].top = yp[i];
         document.layers["flake"+i].left = xp[i]
            + am[i]*Math.sin(dx[i]);
      }//for
   setTimeout("snowNS()", speed);
}//snowNS

function snowDocument() {      // MSIE4, Opera5, Netscape5 main
   for (i=0; i<no; ++i) {      // iterate for every flake
      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();
      }//if
      dx[i] += stx[i];
      snowobj[i].top  = yp[i];
      snowobj[i].left = xp[i] + am[i]*Math.sin(dx[i]);
   }//for
   setTimeout("snowDocument()", speed);
}//snowDocument

if (ns4b) {                   // Netscape4
   snowNS();
} else if (b4up) {            // MSIE4, Opera5, Netscape5
   snowDocument();
}//if

zwar beim IE läuft, aber beim Firefox (den ich benutze), bleiben die Flocken nur einfach links oben kleben.

Das seltsame, das Script müsste eigentlich gehen, denn auf anderen Seiten funktioniert genau dieses Script einwandfrei !

Wäre jedenfalls nett, falls jemand ne Ahnung hat, das er mir sagt wo der Fehler liegen könnte.

Ohne Werbung machen zu wollen: www.deadforum.net ist das Script, für Gäste ist es derzeit angeschalten, also solltet ihr es im IE sehen können.

Vielen Dank für Antworten !

Thomas

[Siechfred]

Hallo Thomas.

Zur Feier des Tages hab ich mir gedacht (da es heute zum ersten Mal hier schneit), bau ich ein Schnee-Script in mein Forum ein.

Nett :-)

beim Firefox (den ich benutze), bleiben die Flocken nur einfach links oben kleben.

Ziemlich viel Quellcode, um die Fehlersuche zu erleichtern, solltest du uns mitteilen, welche Meldungen in der JS-Konsole des Firefox stehen.

Freundschaft!
Siechfred

[Thomas]

Ziemlich viel Quellcode, um die Fehlersuche zu erleichtern, solltest du uns mitteilen, welche Meldungen in der JS-Konsole des Firefox stehen.

Das ist es ja eben ...
Dort steht kein einziger Fehler ! Der findet das eben voll okay so.
Bin aber drauf gekommen, das irgendetwas in den oberen 5 cm des sichtbaren Bilds, also in etwa im Quellcode bis "DEAD Board letzte News" das Problem auslöst !
Denn bei Weiterleigunsseiten (wo eben diese obere Leiste, die News, und der Chat nicht da sind), schneit es ganz deutlich !

Leider sind meine kenntnisse von fehlerfreiem HTML nicht so übermäßig gut, als ob ich da den Fehler finden würde !

Vielleicht findest du ja auf Anhieb irgendwas !

Vielen Dank jedenfalls für's Versuchen !

Freundschaft!
Siechfred

Gerne !
Thomas

[Siechfred]

Hallo Thomas.

Dort steht kein einziger Fehler ! Der findet das eben voll okay so.

Dein Problem betrifft weniger JS als vielmehr CSS :-)

Die betroffene Funktion snowDocument() soll ja die Position der Flocken ändern. Zu diesem Zweck wurde zuvor in einem Array snowobj die Referenzen auf das style-Objekt (bezogen auf jede Flocke) gespeichert. Geändert werden sollen nun die Eigenschaften "top" und "left". Für die Wertzuweisung gelten CSS-Regeln, siehe Vorbemerkungen zum style-Objekt. Das Javascript macht den eklatanten Fehler, die _Maßeinheit_ wegzulassen, die aber für left und top zwingend anzugeben sind.

<polemik>
Der IE rät auf Grund seiner DAU-kompatiblen Fehlertoleranz zufällig die richtige Maßeinheit "px", ein echter[tm] Browser versucht gar nicht erst zu raten, sondern wendet sich angewidert ab :-)
</polemik>

Also ergänze mal die Funktion snowDocument testweise wie folgt:
snowobj[i].top  = yp[i] + "px";
snowobj[i].left = xp[i] + am[i]*Math.sin(dx[i]) + "px";

Dann sollte es eigentlich auch in Firefox funktionieren.

Freundschaft!
Siechfred

[Thomas]

Also ergänze mal die Funktion snowDocument testweise wie folgt:
snowobj[i].top  = yp[i] + "px";
snowobj[i].left = xp[i] + am[i]*Math.sin(dx[i]) + "px";

Dann sollte es eigentlich auch in Firefox funktionieren.

Freundschaft!
Siechfred

Einwandfrei !

Vielen, vielen Dank, auf den Fehler wäre ich im Leben nicht gekommen !

Achja @wahsaga.
Das mit dem schönen Tag war keine Ironie !
Ich liebe den Schnee, fahre auch begeistert Ski, und hab mich gerade richtig gefreut meine Winterreifen im kleinen Schneetreiben aufzuziehen !
Jetzt tut mir der Rücken weh, aber was solls !

Ist jedenfalls ein super Tag heute !

Thomas

PS: Wie ich gerade gesehen habe, gibts immer noch ein Problem ...
Bei so langen Seiten, wie z.B. der Forumshauptseite zerplatzen die Schneeflocken gleich am Boden, der Boden ist aber für ihn immer der Boden der ersten Seite, scrollt man also runter gibts da keinen Schnee mehr :(

Verantwortlich dafür halte ich diese Deklaration:

var i, doc_width = 800, doc_height = 600;

if (ns4b) {
   doc_width  = self.innerWidth;
   doc_height = self.innerHeight;
} else if (b4up) {
   doc_width  = document.body.clientWidth;
   doc_height = document.body.clientHeight;
} else {
   b4up = 1;                   // 800x600 screen-default
}// if
<<

Kannst du mir zustimmen ?
Was passt nicht ?
Ich denke er holt sich nur die Höhe und Breite des Anzeigebreiches, aber nicht der kompletten Seite, oder liege ich falsch ?

Nochmals vielen Dank :)

[Siechfred]

Hallo Thomas.

Bei so langen Seiten, wie z.B. der Forumshauptseite zerplatzen die Schneeflocken gleich am Boden, der Boden ist aber für ihn immer der Boden der ersten Seite, scrollt man also runter gibts da keinen Schnee mehr :(

Kann ich im IE nicht reproduzieren, beim Runterscrollen schneit es auch bis zum Ende.

Verantwortlich dafür halte ich diese Deklaration:
else if (b4up) {
   doc_width  = document.body.clientWidth;
   doc_height = document.body.clientHeight;

Ja, Body hat keine Eigenschaften clientWidth bzw. clientHeight, das ist Microsoftspezifisch und sollte eigentlich im Firefox einen Fehler werfen. Ändere das mal durch folgende Zeilen:

else if (b4up == 1) {
  doc_width  = document.body.clientWidth;
  doc_height = document.body.clientHeight;
}
else {
  // für Geckos
  b4up = 1;
  doc_width  = screen.availWidth;
  doc_height = screen.availHeight;
}

Dann sollte es gehen.

Freundschaft!
Siechfred

[Thomas]

Leider keine Besserung ...

Zur Anschaung nochmal das Script wie es derzeit aussieht:

var no = 25;                   // number of snowflakes
var speed = 10;                // the smaler, the faster snowflakes
var snowflake = "snow.gif";    // picture source
var ns4b = (document.layers) ? 1 : 0;   // Netscape4.x
var b4up = (document.all) ? 1 : 0;      // MSIE4, Opera5, Netccape5
var dx, xp, yp;                // coordinate and position variables
var am, stx, sty;              // amplitude and step variables
var snowobj;
var i, doc_width = 800, doc_height = 600;

if (ns4b) {
   doc_width  = self.innerWidth;
   doc_height = self.innerHeight;
} else if (b4up == 1) {
  doc_width  = document.body.clientWidth;
  doc_height = document.body.clientHeight;
}
else {
  // für Geckos
  b4up = 1;
  doc_width  = screen.availWidth;
  doc_height = screen.availHeight;
}

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

for (i=0; i<no; ++i) {         // iterate for every snowflake
   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 (ns4b) {                           // set layers
      document.write("<LAYER NAME="flake"+ i +"" LEFT="15" "
      + "TOP="15" VISIBILITY="show"><IMG SRC=""
      + snowflake +"" BORDER=0></LAYER>");
   } else if (b4up) {
      document.write("<DIV ID="flake"+ i +"" STYLE=""
      + "position:absolute; z-index:"+ i +"; visibility:visible; "
      + "top:15px; left:15px;"><IMG SRC=""+ snowflake
      + "" BORDER=0></DIV>");
      snowobj[i] = eval (document.getElementById("flake"+i).style);
   }//if
}//for

function snowNS() {            // Netscape4 main animation function
   for (i=0; i<no; ++i) {      // iterate for every snowflake
      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();
      }//if
         dx[i] += stx[i];
         document.layers["flake"+i].top = yp[i];
         document.layers["flake"+i].left = xp[i]
            + am[i]*Math.sin(dx[i]);
      }//for
   setTimeout("snowNS()", speed);
}//snowNS

function snowDocument() {      // MSIE4, Opera5, Netscape5 main
   for (i=0; i<no; ++i) {      // iterate for every flake
      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();
      }//if
      dx[i] += stx[i];
      snowobj[i].top  = yp[i] + "px";
      snowobj[i].left = xp[i] + am[i]*Math.sin(dx[i]) + "px";
   }//for
   setTimeout("snowDocument()", speed);
}//snowDocument

if (ns4b) {                   // Netscape4
   snowNS();
} else if (b4up) {            // MSIE4, Opera5, Netscape5
   snowDocument();
}//if
<<

[Siechfred]

Hallo Thomas.

Leider keine Besserung ...

Sorry, habe leider hier keinen Gecko zum Testen, IE-only.

Freundschaft!
Siechfred

[Thomas]

Hi Siechfred !

Ich hab die Lösung !

So

else {
  // für Geckos
  b4up = 1;
  doc_width  = document.body.offsetWidth;
  doc_height = document.body.offsetHeight;
}
<<

klappts auch mit dem Firefox !

Vielen Dank für deine Liebe Hilfe !

PS: Als Link hier dran ist ein Forum wo deine Hilfe nochmal gewürdigt wird *G*

DANKE !

[Thomas]

Sorry, der Link war natürlich falsch, jetzt ists der richtige :)

Jednefalls nochmal vielen Dank, und zur Erklärung:

Da ich diese modifikation an meinem Forum natürlich nicht nur für mich alleine machen will, ist bei dem Link ne kurze Erklärung von mir (aka Blackman) zu sehen, wie man ihn in den Forumsprogrammcode einbaut !

Cu,

Thomas

[wahsaga]

hi,

Zur Feier des Tages hab ich mir gedacht (da es heute zum ersten Mal hier schneit), bau ich ein Schnee-Script in mein Forum ein.

wieso, was passt dir denn an diesem schönen tag nicht?

gruß,
wahsaga