var scrollStep=2;  // um wie viele Pixel soll bei jedem Schritt gescrollt werden -> 2
var timer; 

function scrollDivRight(){
  clearTimeout(timer);
  d=document.getElementById('thumbs');  // wo soll gescrollt werden -> thumbs
  d.scrollLeft+=scrollStep;
  timer=setTimeout("scrollDivRight()",10); // nach wie vielen Millisekunden soll weitergescrollt werden -> 10
} 

function scrollDivLeft(){
  clearTimeout(timer);
  d=document.getElementById('thumbs');
  d.scrollLeft-=scrollStep;
  timer=setTimeout("scrollDivLeft()",10);
} 

function stopMe(){
  clearTimeout(timer);  // beende das scrollen
}


function opac(thumb,wert){  // übergebene Werte thumb -> welches, wert -> eine Zahl, siehe auch mouseover/mouseout-Aufruf in Klammern
            thumb.style.opacity = wert;  // alle Browser
            thumb.style.filter = "alpha(opacity=" + wert*100 + ")";  // Internetexplorer
            }


function bildershow(bild){  // übergebener Wert für neues Bild
            document.bild.src = document.bild2.src;  // hinten liegendes Bild = vorn liegendes Bild
            document.bild2.src = bild;  // vornliegendes Bild = neues Bild (übergebener Wert)
            fade(0);  // Aufrufen der Funktion zum langsamen Einblenden des Bildes
            }           

function fade(step) {  // step ist der opacity-Wert des neuen Bildes, Anfangs 0 (übergebener Wert)
            var imgs = document.getElementById("bildgross").getElementsByTagName("img");  //lies die Bilder aus "bildgross" und schreib sie in ein Array
            imgs[1].style.opacity = step/100;  //  alle Browser Wert durch 100 Teilen um 0.2 usw. zu erhalten
            imgs[1].style.filter = "alpha(opacity=" + step + ")"; // IE
            step = step + 2;  // step erhöhen
            if (step <= 100) {  // ist das Bild noch nicht vollständig zu sehen...
                        window.setTimeout(function () { fade(step); }, 1);   // ...Funktion erneut aufrufen
            }
            else {
                document.bild.src = document.bild2.src;
            }
}

