Fade screen element ud/ind giver mudret tekst
Hej,Jeg har et skørt problem med dette script som jeg har fundet på nettet.
Jeg bruger det til at fade et element ud og ind igen med.
Det virker sådan set fint, men nå jeg fader ind, altså kalder scriptet mens elementet er faded ud, så er det som om at teksten i min div ser lidt sløret ud, efter der er faded helt ind.
Trykker jeg F5, så ser alt normalt ud igen.
Er det mon fordi den ikke fader helt ind igen?
Er der evt. en måde jeg kan sikre mig på, at elementet er faded helt ind igen?
Første gang man kalder fade(eid), så fader den ud, kalder man funktionen igen, så fader den ind.
Her er koden:
<script>
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);
}
</script>
