Karl-Franz zu Ferdinand von und bei Dümpelshofen: Grafik über css und JavaScript flackern lassen

Beitrag lesen

Guten Morgen.

Ich habe es jetzt wie folgt gelöst:

var Logo;

window.onload = function ()
{
   Logo = document.getElementById("Logo");

AnimationLogo(0);
}

function AnimationLogo (Status)
{
   if (Status == 0)
   {
      Logo.className = "LL" + rand (1, 10);
      Dummy();
   }
   else
      Logo.className = "LL0";

setTimeout("AnimationLogo(0)", rand (3000, 10000));
}

function rand (min, max)
{
   return Math.floor (Math.random() * (max - min + 1)) + min;
}

function Dummy()
{
   setTimeout("AnimationLogo(1)", 30);
}


>   
> Ist der Code so in Ordnung?  
  
Schön ist das nicht.  
  
- Du brauchst eine Krücke (Dummy()).  
- Du schleppst eine Statusvariable mit dir rum, anstatt einfach den Zustand von .className heranzuziehen.  
- Du klemmst unnötigerweise vier Objekte in den globalen Namensbereich (Logo, AnimationLogo, rand, Dummy).  
- Du benutzt Code in setTimeout(), anstatt einfach eine Funktion zu übergeben.  
  
Für das Fleißsternchen:  
- Benutze immer geschweifte Klammern, auch wenn der Block nur aus einer Zeile besteht.  
- Setze beim Funktionsaufruf entweder immer Leerzeichen zwischen Funktionsname und runder Klammer, oder nie, aber nicht mal so (setTimeout), mal so (Math.floor, rand).  
- Benne Funktionen zumindest einheitlich, nicht mal mit großem ersten Buchstaben (AnimationLogo), mal mit kleinem (rand). Gleiches für alle anderen Sachen.  
  
~~~javascript
  
window.onload = function () {  
    var logo = document.getElementById("Logo"); // lokale Variable  
  
    var rand = function (min, max) { // Funktion auch lokal  
        return Math.floor(Math.random() * (max - min + 1)) + min;  
    }  
  
    var logoblinken = function () { // auch noch lokal  
        if (logo.className == "LL0") { // Zustand von .className direkt nutzen  
            logo.className = "LL" + rand(1, 10);  
            window.setTimeout(logoblinken, 75); // vielleicht reichen ja 75 ms?  
        }  
        else {  
            logo.className = "LL0";  
            window.setTimeout(logoblinken, rand(3000, 10000));  
        }  
    }  
  
    logoblinken(); // erstmalig aufrufen, dann läuft's von selber  
}  

Funktionieren tut er auf jeden Fall. Dennoch habe ich den Eindruck, dass er nicht gerade zimperlich mit Ressourcen umgeht und den PC verlangsamt.

Ein Hintergrundwechsel alle drei bis zehn Sekunden kann dafür nicht verantwortlich sein.