Slideshow auf Webseite einbinden

<style type="text/css>
/* SLIDESHOW */
#slideshow {
height:100px; /* hier Hoehe der Slideshow-Bilder angeben */
position:relative;
}
#slideshow img {
display:none;
position:absolute;
top:0; left:0;
}
#slideshow img.start {
display:block;
}
</style>




Und das "slideshow.js" Script.


/*****
Image Cross Fade Redux
Version 1.0
Last revision: 02.15.2006
[COLOR=Red]********************[/COLOR]




Please leave this notice intact. 


Rewrite of old code found here: slayeroffice | photo fade


modifiziert von Franziska Maelzer: DOM-Scripting-Slideshow die  Netzspielwiese
*****/


window.addEventListener?window.addEventListener("l  oad",so_init,false):window.attachEvent("onload",so _init);


var d=document, bilder = new Array(), zInterval = null, aktuell=0,  pause=false; bilderAnzahl=20;  bilderPfad="http://www.meinedomain.de/bilder/webcam/cam";  geschwindigkeit=1000;


function so_init() {
if(!d.getElementById || !d.createElement)return;    


// erstes Bild wird eingelesen
bild = d.getElementById("slideshow").getElementsByTagName ("img");
bilder[0] = bild[0];
bilder[0].style.display = "block";
bilder[0].xOpacity = .99;


bilder[1] = new Image();
bilder[1].src = bilderPfad + "002.jpg";
bilder[1].xOpacity = 0;
d.getElementById("slideshow").appendChild(bilder[1]);


setTimeout(so_xfade,geschwindigkeit);
neuesBild();
}


function so_xfade() {
cOpacity = bilder[aktuell].xOpacity;
nIndex = bilder[aktuell+1]?aktuell+1:0;
nOpacity = bilder[nIndex].xOpacity;


cOpacity-=.05; 
nOpacity+=.05;


bilder[nIndex].style.display = "block";
bilder[aktuell].xOpacity = cOpacity;
bilder[nIndex].xOpacity = nOpacity;


setOpacity(bilder[aktuell]); 
setOpacity(bilder[nIndex]);


if(cOpacity<=0) {
bilder[aktuell].style.display = "none";
aktuell = nIndex;
setTimeout(so_xfade,geschwindigkeit);
neuesBild();
} else {
setTimeout(so_xfade,50);
}


function setOpacity(obj) {
if(obj.xOpacity>.99) {
obj.xOpacity = .99;
return;
}
obj.style.opacity = obj.xOpacity;
obj.style.MozOpacity = obj.xOpacity;
obj.style.filter = "alpha(opacity=" + (obj.xOpacity*100) + ")";
}    
}


function neuesBild() {
// immer ein Bild vorausladen
if ( (aktuell < (bilderAnzahl-2)) && (bilder.length <  bilderAnzahl) ) {
bilder[aktuell+2] = new Image();
bilder[aktuell+2].src = bilderPfad + "0" + ((aktuell+3)<10 ? "0" +  (aktuell+3) : (aktuell+3)) + ".jpg"
bilder[aktuell+2].xOpacity = 0;
d.getElementById("slideshow").appendChild(bilder[aktuell+2]);
}
}