Fading-Effekt für mehr als 2 Bilder: wie?

[Felix Riesterer]

Lieber Jürgen,

Ich habe leider nur Programmierungskenntnisse rudimentär in HTML und Schulwissen darüber von vor 20 Jahren ...

das wäre doch DIE Gelgenheit, JavaScript dazuzulernen! Wenn Du willst, dann fange ich hier gleich damit an, Deinen Code zu analysieren, damit wir daraus etwas Neues bauen können. OK?

Ich poste einmal den JavaScript-Code von Deiner Seite:

  <script language="JavaScript">  
<!-- Begin

/************************************************************************  
Script made by Martial Boissonneault © 2001 http://getElementById.com/  
This script may be used and changed freely as long as this msg is intact  
Visit http://getElementById.com/ for more free scripts and tutorials.  
*************************************************************************/  
var ie5=(document.getElementById && document.all);  
var ns6=(document.getElementById && !document.all);  
nPlus = 5 //the % of fading for each step  
speed = 150 //the speed  
// You don't have to edit below this line  
nOpac = 100  
function FadeImg(){  
if(document.getElementById){  
document.getElementById('img1').style.visibility="visible";  
imgs = document.getElementById('img2');  
opacity = nOpac+nPlus;  
nOpac = opacity;  
setTimeout('FadeImg()',speed);  
if(opacity>100 || opacity<0){  
nPlus=-nPlus;  
}  
if(ie5){  
imgs.style.filter="alpha(opacity=0)";  
imgs.filters.alpha.opacity = opacity;  
}  
if(ns6){  
imgs.style.MozOpacity = 0;  
imgs.style.MozOpacity = opacity/100;  
}  
}  
}  
onload=FadeImg;  
// End -->

</script>

Dieser JavaScript-Code sollte zuallererst in eine externe Textdatei (mit der Endung ".js") gespeichert werden, um ihn von dort aus einzubinden. Fangen wir also an. Neue Textdatei mit dem Dateinamen "image-fader.js" erstellt und alles zwischen dem "<!-- Beginn" und "// Ende -->" (die beiden aber nicht selbst auch!) in diese JavaScript-Datei kopiert und abgespeichert!

So, diese JavaScript-Datei sollte nun Deinem Projekt hinzugefügt werden. Das bedeutet, dass Du sie irgendwo auf dem Server ablegen solltest. In meinem Falle speichere ich alles, was mit JavaScript zu tun hat in einem extra JavaScript-Ordner, den ich sinnigerweise "js" nenne. Ich empfehle Dir, dasselbe zu tun.

Du hast jetzt Deine neue JavaScript-Datei in diesem Ordner und kannst sie in Deinem HTML-Dokument nun so einbinden:
<script type="text/javascript" src=js/iamge-fader.js"></script>
Eventuell musst Du den Pfad anpassen, falls Deine HTML-Datei nicht im selben Verzeichnis liegt, wie der "js"-Ordner.

Wie wir Dein Script umschreiben, verrate ich im nächsten Posting, wenn Du das willst.

Liebe Grüße aus Ellwangen,

Felix Riesterer.