Javascript - Background Fade

JavaScript

Background Fade

Fades document background from one color to another.

There is a lot of code here, but we are only concerned with the function fadein() near the bottom of the example code. The first three numbers are the starting RGB values of the fade. The second three are the ending RGB values of the fade. If 255,255,255 were used for the first three numbers and 0,0,0 were used for the second set of three numbers the background would fade form white to black The seventh number is the amount of steps or color changes there will be from the starting RGB value to the ending RGB value.

Place code immediately after the BODY in your documents body tag.
Example:

<BODY> Place background fade code here

Code:

<SCRIPT LANGUAGE="Javascript">
<!--
function makearray(n) {
	this.length = n;
    	for(var i = 1; i <= n; i++)
        this[i] = 0;
    return this;
}
hexa = new makearray(16);
for(var i = 0; i < 10; i++)
    hexa[i] = i;
hexa[10]="a"; hexa[11]="b"; hexa[12]="c";
hexa[13]="d"; hexa[14]="e"; hexa[15]="f";
function hex(i) {
    if (i < 0)
        return "00";
    else if (i > 255)
        return "ff";
    else
        return "" + hexa[Math.floor(i/16)] + hexa[i%16];
}

function setbgColor(r, g, b) {
    var hr = hex(r); var hg = hex(g); var hb = hex(b);
    document.bgColor = "#"+hr+hg+hb;
}

function fade(sr, sg, sb, er, eg, eb, step) {
    for(var i = 0; i <= step; i++) {
       setbgColor(
        Math.floor(sr * ((step-i)/step) + er * (i/step)),
        Math.floor(sg * ((step-i)/step) + eg * (i/step)),
        Math.floor(sb * ((step-i)/step) + eb * (i/step)));
    }
}

// CHANGE HERE!
// the first three numbers after "fade(" are the starting RGB values, 
// the second set of three numbers are the ending RGB values of the fade.
// the seventh number is the amount of steps or color changes from starting
// RGB values to ending RGB values.
// ex. fade(255,255,255,0,0,0,125) this starts out white (255,255,255 = white)
// and ends black (0,0,0 = black) with 125 steps in between.

function fadein() {
	fade(255,32,1, 255,255,255, 125);
}

fadein();
// -->
</SCRIPT>