Ladeanzeige bis nächste Grafik geladen ist

[xfoto]

function zaehlen() {

document.aktives_foto.style.opacity = '0.1';
  var img = new Image();
  img.onload = function() { document.aktives_foto.src = img.src; }
  img.src = fotos[i];
  img.style.opacity = '1'; //geht nicht
}

  
Ahhh doch [geschafft](http://xfoto.at/xfoto/test.html):  
~~~javascript
function zaehlen() {  
  document.aktives_foto.style.opacity = '0';  
  var img = new Image();  
  img.onload = function() {  
    document.aktives_foto.src = img.src;  
    document.aktives_foto.style.opacity= '1'; }  
  img.src = fotos[i];  
}

Könnte mir das nur jemand mal kurz erläutern:

in der Funktion zaehlen wird
1. das img mit Name "aktives_foto" auf null Deckkraft gesetzt (+ somit gif sichtbar)
2. eine Variable img wird erzeugt: wozu?
3. wenn das Event onload (=sobald fertiggeladen??) des Elementes img passiert wird die nachfolgende Funktion (a.+b.) ausgeführt
3a. es wird document.aktives_foto.src auf img.src "gekürzt"
3b. "aktives_foto" wird wieder auf 100% Deckkraft gesetzt
4. img.src (was = ist mit document.aktives_foto.src) holt sich das neue Foto

Die Reihenfolgen und auch Sinnhaftigkeiten verstehe ich großteils nicht, würde aber gerne ..... ;-(