I have a page that when initially served, displays 3 instances of an image named "OnPic.gif". On page load, a timer is instantiated, and after the specified amount of time (2 seconds in my case), all 3 instances of OnPic.gif are replaced by another image, OffPic.gif. Two seconds later, OnPic.gif comes back, OffPic.gif goes away, and the cycle continues indefinitely.
Problem: Ideally, I could use the same function to update all three images, which are identified as b1, b2, and b3.
<img id="b1" src="OnPic.gif" alt="" />
However, when attempting to pass the image id value (b1 for example), to the function, cooperation = 0.
The code shown below results in the error "invalid argument", which occurs when execution hits this line:
var b3Timer = window.setInterval(flashB3("b3"), 2000);
The functions "flashB1" and "flashB2" work correctly, and are included to demonstrate that the problem is directly associated with passing the argument to the funciton. I appreciate the contributions, but please resist the urge to post workarounds and alternative solutions, as there is more to this project objective than the simplified version submitted here. Thanks in advance for taking a look.
function flashB1()
{
document.getElementById("b1").src =
(document.getElementById("b1").src.indexOf("OnPic.gif") == -1)
? "OnPic.gif" : "OffPic.gif";
}
function flashB2() {
document.getElementById("b2").src =
(document.getElementById("b2").src.indexOf("OnPic.gif") == -1)
? "OnPic.gif" : "OffPic.gif";
}
function flashB3(arg) {
document.getElementById(arg).src =
(document.getElementById(arg).src.indexOf("OnPic.gif") == -1)
? "OnPic.gif" : "OffPic.gif";
}
window.onload = function() {
var b1Timer = window.setInterval("flashB1()", 2000);
var b2Timer = window.setInterval(flashB2, 2000);
var b3Timer = window.setInterval(flashB3("b3"), 2000);
}