JSVollNoob: FadeEffekt will nicht fuktionieren

Beitrag lesen

SELF-Forum

FadeEffekt will nicht fuktionieren

JSVollNoob
– Informationen zu den Bewertungsregeln

so danke erstmal.
Ich habe mir eure Nachrichten durchgelesen und habe selbst im Netz geforscht. Der Ansatz mit dem rgb(...) ist wohl nicht so gut da man auch opacity und filter -> opacity manipulieren kann. Habe dazu ein einfaches script gefunden, welches ich verstehe, und auf meine Bedürfnisse angepasst.

  
<html>  
<head><title>Fade Test</title></head>  
<body>  
  
<span id="quote1">test 1</span>  
  
  
<script type="text/javascript">  
var TimeToFade = 1000.0;  
  
function fade(eid)  
{  
  var element = document.getElementById(eid);  
  if(element == null)  
    return;  
  
  if(element.FadeState == null)  
  {  
    if(element.style.opacity == null  
        || element.style.opacity == ''  
        || element.style.opacity == '1')  
    {  
      element.FadeState = 2;  
    }  
    else  
    {  
      element.FadeState = -2;  
    }  
  }  
  
  if(element.FadeState == 1 || element.FadeState == -1)  
  {  
    element.FadeState = element.FadeState == 1 ? -1 : 1;  
    element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;  
  }  
  else  
  {  
    element.FadeState = element.FadeState == 2 ? -1 : 1;  
    element.FadeTimeLeft = TimeToFade;  
    setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "')", 33);  
  }  
}  
  
function animateFade(lastTick, eid)  
{  
  var curTick = new Date().getTime();  
  var elapsedTicks = curTick - lastTick;  
  
  var element = document.getElementById(eid);  
  
  if(element.FadeTimeLeft <= elapsedTicks)  
  {  
    element.style.opacity = element.FadeState == 1 ? '1' : '0';  
    element.style.filter = 'alpha(opacity = '  
        + (element.FadeState == 1 ? '100' : '0') + ')';  
    element.FadeState = element.FadeState == 1 ? 2 : -2;  
    return;  
  }  
  
  element.FadeTimeLeft -= elapsedTicks;  
  var newOpVal = element.FadeTimeLeft/TimeToFade;  
  if(element.FadeState == 1)  
    newOpVal = 1 - newOpVal;  
  
  element.style.opacity = newOpVal;  
  element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';  
  
  setTimeout("animateFade(" + curTick + ",'" + eid + "')", 33);  
}  
  
function pausecomp(millis)  
{  
var date = new Date();  
var curDate = null;  
  
do { curDate = new Date(); }  
while(curDate-date < millis);  
}  
  
fade('quote1');  
  
<!-- wenn ich den hier umklammerten code weglasse funktioniert es und er fadet zumindest quote1 aus -->  
pausecomp(1000.0);  
fade('quote1');  
<!-- weglassen ende -->  
  
</script>  
  
</body>  
</html>

so nun sollte in meinem Beispiel hier eigentlich "quote1" ausgeblendet und wieder eingeblendet werden. passiert aber nicht. da Timeout ja scheinbar unabhängig von dem Fortlaufen des Scripts ist habe ich auch schon mal das script für ne Sekunde warten lassen nach dem ersten fade. Leider ist das Ergebnis nicht gut. Es funktioniert gar nicht. nur wenn ich die letzten beiden Anweisungen weglasse, fadet es aus. Was mache ich falsch.
Danke für eure Hilfe.

Beitrag melden
–
Informationen zu den Bewertungsregeln