JSVollNoob: FadeEffekt will nicht fuktionieren

Beitrag lesen

SELF-Forum

FadeEffekt will nicht fuktionieren

JSVollNoob
– Informationen zu den Bewertungsregeln

Hallo Leute, ich habe natürlich alles mindestens überflogen und aber auch auf eingene Faust recherchiert und mir Gedanken gemacht. Wie mein Nick schon aussagt, kenn ich mich nicht besonders gut mit JS aus und würde es auch nicht lernen wollen wenn ich nicht müsste. Trotzdem bin ich euch allen sehr dankbar. habe das Problem jetzt folgendermaßen gelöst:

  
<html>  
<head><title>Fade Test</title></head>  
<body>  
  
<span id="quote1">test 1</span>  
<span id="quote2">test 2</span>  
<span id="quote3">test 3</span>  
  
<script type="text/javascript">  
var TimeToFade = 1000.0;  
var DisplayDelay = 3000.0;  
var NoOfSpans = 3;  
  
  
var DisplayDelaySwitch = 0; //helps with Delay  
var Count = 1; // counts current container  
  
function fade(lastTick, eid)  
{  
  // Init Block  
  var element = document.getElementById(eid+Count);  
  if(element == null)  
    return;  
  
  if((element.FadeState != 1) && (element.FadeState != -1)) // 1 = fade in // 2 = fade out  
  {  
  	element.FadeState = 1;  
  	element.FadeTimeLeft = TimeToFade;  
  }  
  // Init end  
  
  
  
  var curTick = new Date().getTime();  
  var elapsedTicks = curTick - lastTick;  
  var delay = 33; // TimeOut Period  
  
  if(DisplayDelaySwitch == 1)  
  {  
  	DisplayDelaySwitch = 0;  
  	element.FadeTimeLeft = TimeToFade;  
  	elapsedTicks = 0;  
  }  
  
  if(element.FadeTimeLeft <= elapsedTicks)  
  {  
    if(element.FadeState == 1)  
    {  
    	delay = DisplayDelay;  
    	DisplayDelaySwitch = 1;  
    }  
    else  
    {  
    	if(document.getElementById('quote'+(Count+1)) == null)  
    	{ Count = 1; }  
    	else  
    	{ Count++; }  
    }  
  
    element.style.opacity = element.FadeState == 1 ? '1' : '0';  
    element.style.filter = 'alpha(opacity = ' + (element.FadeState == 1 ? '100' : '0') + ')';  
    element.FadeState = element.FadeState == 1 ? -1 : 1;  
    element.FadeTimeLeft = TimeToFade;  
  }  
  else  
  {  
  	element.FadeTimeLeft -= elapsedTicks;  
  	var newOpVal = element.FadeTimeLeft/TimeToFade;  
  	if(element.FadeState == 1)  
    {	newOpVal = 1 - newOpVal; }  
  	else  
	{   newOpVal = 0 + newOpVal; }  
  
  
 	element.style.opacity = newOpVal;  
  	element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';  
  }  
  setTimeout("fade(" + curTick + ",'" + eid + "')", delay);  
  
}  
  
while(document.getElementById("quote"+Count) != null)  
{  
	document.getElementById("quote"+Count).style.opacity = 0;  
	Count++;  
}  
Count = 1;  
fade( new Date().getTime(), 'quote');  
  
  
  
</script>  
  
</body>  
</html>

Rekursion scheint wirklich der einzige Weg zu sein, wie ich dem setTimeOut bei kommen kann. das mit der Pause-Schleife is mir auch komisch vorgekommen, da es in jeder anderen Programmiersprache, die ich kenne eleganter geht.
Jedenfalls läuft es jetzt. Danke nochmal

Beitrag melden
–
Informationen zu den Bewertungsregeln