background color shift on timeout

mpalmer12345 · Mar 19, 2004

I want to do a simple alternation betwen black and white background colors. (I may expand it later to more colors, which explains the code below.) I would think the simple code below would work, but it doesn't! Why not?

Dec2Hex is a conversion function, obviously.

...

function changeBG(ii) {
bgR = (ii % 2) * 255;
bgG = (ii % 2) * 255;
bgB = (ii % 2) * 255;
bgRHex = Dec2Hex(bgR);
bgGHex = Dec2Hex(bgG);
bgBHex = Dec2Hex(bgB);
document.bgColor = bgRHex + bgGHex + bgBHex;
ii += 1;
setTimeout("changeBG(" + ii + ")", 1000);
}

//-->
</script>

</HEAD>
<BODY BGCOLOR=#FFFFFF onLoad="changeBG(0)">
</BODY>
</HTML>

jemminger · Mar 20, 2004

change
document.bgColor = bgRHex + bgGHex + bgBHex

to
document.body.style.backgroundColor = bgRHex + bgGHex + bgBHex

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); }

mpalmer12345 · Mar 21, 2004

Thanks, but that doesn't seem to fix the problem. All attempts at adding a loop the timeout fails. I only get a single change at the end, not a new change every 1000ms. I would like a loop someplace, say

(ii=0; ii<10; ii++) {
...
}

to generate a total of 10 different colors with changeBG(ii), one every 1000 ms.

When I do this

function changeBG(ii) {
(ii=0; ii<10; ii++) {
...
setTimeout("changeBG(" + ii + ")", 1000);
}

it doesn't work.

jemminger · Mar 21, 2004

the loop doesn't work because the script engine runs through the loop at full speed, and you end up with a stack of 10 timeouts a few milliseconds apart.

you need to do something like this:

Code:

var c = 0;

function foo() {
  //  do stuff

  //  loop
  if (c++ < 10) {
    foo();
  }
}

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); }

mpalmer12345 · Mar 21, 2004

Sorry for being so stupid! Okay, I've simplified the code as much as I can and I still can't make it work! All I get is c=1 written to screen.

var c = 0;
function changeBGx() {
if (c++ < 10) {
document.write("c = " + c + "<BR>");
}
setTimeout("changeBGx()", 1000);
};

...

</HEAD>
<BODY BGCOLOR=#FFFFFF onLoad="changeBGx()">
</BODY>
</HTML>

jemminger · Mar 21, 2004

you can't use document.write() here, since it replaces the document's contents including the js function that called it with what you write.

this would be better:

Code:

<html>
<head>
<title>test</title>
<script type="text/javascript">
var c = 0;
function changeBGx() {
  if (c++ < 10) {
    document.foo.bar.value += "c = " + c + "\n";
  }
  setTimeout("changeBGx()", 1000);
}
</script>
</HEAD>
<BODY BGCOLOR=#FFFFFF onLoad="changeBGx()">
<form name="foo">
  <textarea name="bar"></textarea>
</form>
</BODY>
</HTML>

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); }

mpalmer12345 · Mar 21, 2004

Thanks! You are absolutely right, and things are working fine now.

Thanks, again.

dc20 · Mar 24, 2004

By the way, where did this "foo" and "foo bar" convention come from anyway ? LOL

jemminger · Mar 24, 2004

i'm not sure...it's some sort of pseudo-tradition, like how "hello world" is the first program you write

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); }

BillyRayPreachersSon · Mar 24, 2004

Which came first... foobar or fubar?

jemminger · Mar 25, 2004

fubar i'm sure...

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); }

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

background color shift on timeout

mpalmer12345

Programmer

jemminger

Programmer

mpalmer12345

Programmer

jemminger

Programmer

mpalmer12345

Programmer

jemminger

Programmer

mpalmer12345

Programmer

dc20

Technical User

jemminger

Programmer

BillyRayPreachersSon

Programmer

jemminger

Programmer

Similar threads

Part and Inventory Search

Sponsor