skip to content
randomscripts logo Scripts the webs worst backgrounds la gavage oregon milkweed project contact
 

Sequential Background Color Script

This script constantly changes the background color of the page using a preset sequence of colors. In the example, I have used "Web Safe" colors to cycle through the rainbow in the sequence Red > Orange > Yellow > Green > Blue > Indigo > Violet > Red.

To use this script, you will need to insert the following code into the header portion of your HTML document, preferably right before the </HEAD> tag.

<SCRIPT LANGUAGE="JAVASCRIPT">
<!--

var secs = 5;

var i = new Array(22);
i[0] = "#ff0000";
i[1] = "#ff3300";
i[2] = "#ff6600";
i[3] = "#ff9900";
i[4] = "#ffcc00";
i[5] = "#ffff00";
i[6] = "#99cc33";
i[7] = "#99ff33";
i[8] = "#00ff00";
i[9] = "#00ff66";
i[10] = "#ccffcc";
i[11] = "#00ffff";
i[12] = "#00ccff";
i[13] = "#3399ff";
i[14] = "#0000ff";
i[15] = "#6666Cc";
i[16] = "#9966cc";
i[17] = "#9933ff";
i[18] = "#9900cc";
i[19] = "#990099";
i[20] = "#cc3399";
i[21] = "#ff3399";

var j = 0
var k = 23

function nextBG(){
	if (document.images){
	j++
	if (j == k){
	j = 0
	}
	document.bgColor=i[j]
	setTimeout("nextBG()",secs * 1000)
	}
}
//-->
</SCRIPT>

Step 2 is to modify the <BODY> tag to read:

<BODY onload="nextBG()">

Step 3 is to set the interval that you want between color changes. This is set by the statement:

var secs = .5;

In this case, the interval is set to .5 seconds. You can set it to anything you want, just be aware that the lower the number, the faster the colors will change. This can be really straining to the eyes.

You can modify this script to use more or less colors, as desired. In either case, you will need to change three things (the first two shown in blue above): The number in parentheses in the new Array() statement, which corresponds to the number of items in the array, the value of the variable k and the actual array statements.

To add one color to the array, add one to both the numbers in blue. Then add an array element statement to the end of the array:

i[22] = "#ff00ff";

To remove one color from the array, subtract one from both the numbers in blue. Then remove the last array element statement from the array.

That's all there is to it!


Copyright © 2002 randomscripts, All Rights Reserved.     Disclaimer