// Funktion kann mit JavaScript Bilder schrittweise (animiert) umblättern
// Die Element-ID des auszublendenden Elements wird als Zeichenkette angegeben.
// Der zweite Parameter gibt die Schrittweite in % an, mit der das Bild ein- oder
// ausgeblendet werden soll. Negative Werte blenden aus; Positive blenden ein
// Beim InternetExplorer sind das % von 1, ansonsten % von 100

var timeoutTurn = new Array();
var timeoutNachZeit = new Array();
var aktivTurn = new Array();
var status = new Array();


timeoutNachZeit[11]=0;
timeoutNachZeit[12]=0;
timeoutNachZeit[13]=0;
timeoutNachZeit[21]=0;
timeoutNachZeit[22]=0;
timeoutNachZeit[23]=0;
timeoutNachZeit[31]=0;
timeoutNachZeit[32]=0;
timeoutNachZeit[33]=0;
timeoutTurn[11]=0;
timeoutTurn[12]=0;
timeoutTurn[13]=0;
timeoutTurn[21]=0;
timeoutTurn[22]=0;
timeoutTurn[23]=0;
timeoutTurn[31]=0;
timeoutTurn[32]=0;
timeoutTurn[33]=0;
aktivTurn[11]=null;
aktivTurn[12]=null;
aktivTurn[13]=null;
aktivTurn[21]=null;
aktivTurn[22]=null;
aktivTurn[23]=null;
aktivTurn[31]=null;
aktivTurn[32]=null;
aktivTurn[33]=null;
status[11]='aus';
status[12]='aus';
status[13]='aus';
status[21]='aus';
status[22]='aus';
status[23]='aus';
status[31]='aus';
status[32]='aus';
status[33]='aus';

function turnoverNachZeit(mydivision,myhtml,background)
{
 AktNr=mydivision.substr(8,2);
 timeoutNachZeit[AktNr]=setTimeout(function(){turnover(mydivision, myhtml, background);},500);
}

function turnover(mydivision,myhtml,background)
{
 AktNr=mydivision.substr(8,2);
 clearTimeout(timeoutNachZeit[AktNr]);
 timeoutNachZeit[AktNr]=0;
 mynewbg='url("'+background+'")';
 if ( status[AktNr]!='aus' )
 {
  //nur das juengste Ereignis bleibt bestehen
  clearTimeout(timeoutNachZeit[AktNr]);
  timeoutNachZeit[AktNr]=0;
  clearTimeout(timeoutTurn[AktNr]);
  timeoutTurn[AktNr]=0;
  timeoutTurn[AktNr]=setTimeout(function(){turnover(mydivision, myhtml, background);},2);
 }
 else
 {
  turnover_start(mydivision, myhtml, mynewbg);
 }
}

function turnover_start(mydivision,myhtml,mynewbg)
{
 AktNr=mydivision.substr(8,2);
 document.getElementById (mydivision).innerHTML="";
 turn(mydivision, myhtml, mynewbg, -15);
 status[AktNr]='turnover';
}

function turnback(mydivision,myhtml,mynewbg)
{
 AktNr=mydivision.substr(8,2);
 document.getElementById (mydivision).innerHTML="";
 document.getElementById (mydivision).style.backgroundImage=mynewbg;
 turn(mydivision, myhtml, mynewbg, 15);
 status[AktNr]='turnback';
}

function turn(mydivision, myhtml, mynewbg, step) 
{
 AktNr=mydivision.substr(8,2);
 // Wenn das Element existiert
 if (document.getElementById (mydivision))
 {
  // Intervall noch nicht gestartet?
  if (!aktivTurn[AktNr]) 
  {
   // Schrittweite muss positiv  sein, da
   // sonst nicht ausgeblendet wird.
   if ( step == 0) 
   {
    // Fehlermeldung und Beenden, wenn Schrittweite >= 0
    alert ('Schrittweite darf nicht 0 sein!');
    return;
   }
   // Ansonsten kann die Animation gestartet werden.
    window.clearInterval (aktivTurn[AktNr]);
   aktivTurn[AktNr] = null;
   aktivTurn[AktNr] = window.setInterval ('turn("' + mydivision + '", "' + myhtml + '", \'' + mynewbg + '\', ' + step + ')', 1);
   if (step<0) status[AktNr]=status[AktNr]+'ausblenden';
   else status[AktNr]=status[AktNr]+'einblenden';
  }
  else 
  {
   // Wir befinden uns bereits in der Ein- Ausblendphase
   var e = document.getElementById (mydivision);
   var mywidth;
   help=e.offsetWidth + step;
   mywidth = help + 'px';  
   if ( (step < 0 && help > 0) || ( step > 0 && help < mydivwidth ) ) 
   {
    e.style.width=mywidth;
   }
   else 
   {
    // Endzustand (vollständig ein-/ausgeblendet) erreicht!
    // Prozess kann nun abgebrochen werden.
    if ( step < 0 ) 
    {
     window.clearInterval (aktivTurn[AktNr]);
     aktivTurn[AktNr] = null;
     turnback(mydivision, myhtml, mynewbg);
    }
    else 
    {
     document.getElementById (mydivision).innerHTML=document.getElementById (myhtml).innerHTML;
     window.clearInterval (aktivTurn[AktNr]);
     aktivTurn[AktNr] = null;
     e.style.width=mydivwidth +'px';
     status[AktNr]='aus';
    }
   }
  }
 }
 else alert("Das Element "+mydivision+" existiert nicht");
}