Timer werkt niet correct

[Garpie]

Ik heb 3 knoppen, als je op een knop drukt moet deze knop beginnen te flashen...
De tijd is ingesteld op 1 seconde maar toch flasht die veel te snel. Wat doe ik hierbij fout?


[JS]<script language="javascript" type="text/javascript">
var myStyle;
var i = 0;
function flash(obj){
i++;
myStyle = obj.style.background;
if (myStyle == 'rgb(255, 0, 255)'){
obj.style.backgroundColor = '#FF0000';
} else {
obj.style.backgroundColor = '#FF00FF';
}
if (i == 25){
obj.style.backgroundColor = '#FFFFFF';
i = 0;
clearTimeout(timer);
} else {
timer = setTimeout(flash(obj), 1000);
}
}

</script>[/JS]

 

[rajmv]

simpele vraag, simpel antwoord

probeer dit eens;

timer = setTimeout(function() {
flash(obj),
}, 1000);

wat je nu namelijk doet is in iedere loop interatie 'm meteen aanroepen. je geeft de return value van flash(obj) als parameter aan setTimeout, terwijl die een function() {} of javascript-als-string verwacht.

 

[csshunter]

Toch iets gecompliceerder?
De loop-variabele i is globaal: moet er niet een stopFlash() functie ingebouwd worden die eerst de lopende flitsen stopzet en de i reset op 0, als er tijdens het knipperen van de ene knop op een andere knop wordt geklikt?

Ook de myStyle-variable zal daarom binnen de functie flash(obj) moeten blijven, lijkt me.

En:
[JS]var i = 0;
function flash(obj){
i++
var thisObj = document.getElementById(obj);
var bgCol = thisObj.style.backgroundColor;
// alert(bgCol);
if (
bgCol == 'rgb(255, 0, 255)' // voor Firefox, Chrome, Opera, Safari
|| // of:
bgCol == '#ff00ff' // voor IE6, IE7, IE8 !
)
{bgCol = '#FF0000';}
else {bgCol = '#FF00FF';}
... enz.[/JS]
Zien de IE-toeschouwers ook wat knipperen.

Met vriendelijke groet,
CSShunter

 

[Garpie]

Hartelijk dank, zodra ik de tijd heb zal ik beide meteen uittesten!