Karsten: Farbwechsel verzögern

SELF-Forum

Farbwechsel verzögern

Karsten
– Informationen zu den Bewertungsregeln

Hallo,
Ich gehe hier meine ersten Schritte in html und javascript.
Ich habe in alten Aufzeichnungen ein Script gefunden, welches an simplen Beispielen die Deklaration von Funktionen und deren Aufruf erläutern soll.
Leider zeigt das Demo nicht den gewünschten "Sonnenaufgangseffekt" sondern blendet sofort von schwarz auf gelb.
Liegt es an dem schnellen Prozessor, kann man eine Verzögerung in die Schleife packen oder stimmt was am script nicht?
Für einen Tipp dankbar...
Grüße
Karsten

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Farbwechsel verzögern

    Karsten
    – Informationen zu den Bewertungsregeln

    Hm, blöd, habe das script vergessen anzuhängen. Hier ist es:

    <html>
      <head>
        <title> Licht an </title>

    <script language="JavaScript" type="text/javascript">
       <!--
          function farbzahl(dezzahl)
         {
          var hex="";
          var z1;
          var z2;
          z1=Math.floor(dezzahl/16);
          z2=dezzahl % 16;
          if (z1<10) hex=hex+z1;
          if (z1==10) hex=hex+"A";
          if (z1==11) hex=hex+"B";
          if (z1==12) hex=hex+"C";
          if (z1==13) hex=hex+"D";
          if (z1==14) hex=hex+"E";
          if (z1==15) hex=hex+"F";

          if (z2<10) hex=hex+z2;  
      if (z2==10) hex=hex+"A";  
      if (z2==11) hex=hex+"B";  
      if (z2==12) hex=hex+"C";  
      if (z2==13) hex=hex+"D";  
      if (z2==14) hex=hex+"E";  
      if (z2==15) hex=hex+"F";  
  
      return hex;  
      }  


function lichtan()  
      {  
      var r,g,b="00";  
      for (var zahl=0; zahl<256; zahl++)  
	{  
	r=farbzahl(zahl);  
	g=farbzahl(zahl);  
	window.document.bgColor="#"+r+g+b;  
	}  
      }

    //-->
        </script>
      </head>
    <body bgcolor="000000">
      <h2> Die Sonne ist aufgegangen</h2>
      <form>
          <input type="button" name="an" value="LICHT AN" onclick="lichtan()">
    &nbsp;&nbsp;&nbsp;
          <input type="button" name="aus" value="LICHT AUS" onclick="lichtaus()">
      </form>
    </body>
    </html>

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Farbwechsel verzögern

      JürgenB Homepage des Autors
      +4 Informationen zu den Bewertungsregeln

      Hallo Karsten,

      for (var zahl=0; zahl<256; zahl++)
      {
      r=farbzahl(zahl);
      g=farbzahl(zahl);
      window.document.bgColor="#"+r+g+b;
      }

      fast (?) alle Browser arbeiten erst das Script ab und setzen erst danach eventuelle Änderungen an Inhalt und Layout um. Die Schleife oben ändert so schnell es geht die Farben, ohne das da jemand was davon sieht. Erst wenn die Schleife und der Rest des Scriptes abgearbeitet sind, wird die letzte Farbe angezeigt. Da Javascript kein "wait" kennt, musst du das Script nach jeder Änderung anhalten und verzögert neu starten. Siehe hierzu z.B. diesen Artikel: http://aktuell.de.selfhtml.org/artikel/javascript/timer/

      Gruß, Jürgen

      Beitrag melden
      +4
      Informationen zu den Bewertungsregeln

      1. Farbwechsel verzögern

        Karsten
        – Informationen zu den Bewertungsregeln

        Hallo Jürgen, vielen Dank für den fachkundigen Hintergrund. Ich werde mal versuchen, die Farbzahl gebende Funktion verzögert aufzurufen mittels window.setTimeout.
        Über Erfolg /Misserfolg werde ich hier noch mal kurs berichten.
        Gruß
        Karsten

        Hallo Karsten,

              for (var zahl=0; zahl<256; zahl++)  
  {  
  r=farbzahl(zahl);  
  g=farbzahl(zahl);  
  window.document.bgColor="#"+r+g+b;  
  }

        fast (?) alle Browser arbeiten erst das Script ab und setzen erst danach eventuelle Änderungen an Inhalt und Layout um. Die Schleife oben ändert so schnell es geht die Farben, ohne das da jemand was davon sieht. Erst wenn die Schleife und der Rest des Scriptes abgearbeitet sind, wird die letzte Farbe angezeigt. Da Javascript kein "wait" kennt, musst du das Script nach jeder Änderung anhalten und verzögert neu starten. Siehe hierzu z.B. diesen Artikel: http://aktuell.de.selfhtml.org/artikel/javascript/timer/

        Gruß, Jürgen

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln