Disco Background effect to work with Text and Images

Magicjax · 11-22-2009, 07:57 AM

Hello everyone. I hope I'm posting this in the right place.

I'm using the Disco Background Effect script found here that causes the background color of the page to continuously change.

For my design I need other aspects of the page to change along with it. Such as some title Text and HR lines.

Is it possible to call this script to work on other things such as images, text and HR lines? In other words I want some text to change color in time with the background changing.

I appreciate any help you might have.

Ron

rubenbuhr · 11-23-2009, 05:36 AM

Well, maybe you can get a grip on this code instead?

PHP Code:


			
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD><TITLE>Su8-35pm49</TITLE>
<META http-equiv=Content-Type content="text/html; charset=UTF-8">
<STYLE type=text/CSS>


</STYLE>
<SCRIPT type="text/javascript">

 var steps=50;     var speed=50;     var tt;     var ck=steps;
 var oz='rgb('+newColor()+','+newColor()+','+newColor()+')';

function newColor(){return Math.round(Math.random()*255)}
function dif(a,b){return (Number(b)+Number(a))}
function fbgc(z){
    oz='rgb('+newColor()+','+newColor()+','+newColor()+')';
    n=oz.substring(4,oz.length-1).split(',');
    document.body.style.backgroundColor=z;
    o=z.substring(4,z.length-1).split(',');
    e=[Math.round((n[0]-o[0])/steps),Math.round((n[1]-o[1])/steps),Math.round((n[2]-o[2])/steps)];
 tt=setTimeout("fade()",speed)
}
function fade(){
    d=[dif(e[0],o[0]),dif(e[1],o[1]),dif(e[2],o[2])]
    z= 'rgb('+d[0]+','+d[1]+','+d[2]+')';
    tz='rgb('+(255-d[0])+','+(255-d[1])+','+(255-d[2])+')'
    document.body.style.backgroundColor=z;
    o=z.substring(4,z.length-1).split(',');
 ck--; 
 if(ck != 0){    tt=setTimeout("fade()",speed)}
 else{ck=steps; fbgc(z) }
document.getElementById('zcT').innerHTML='Background= '+z+'<BR>TextColor= '+tz+'';
document.getElementById('zcT').style.color=tz
}
</SCRIPT>
</HEAD>
<BODY scroll="auto" onload="fbgc(oz)">
<div id="zcT"></div><p>
<input type=button onclick="this.value=='stop'?clearTimeout(tt,this.value='go'):fade(this.value='stop');" value="stop">
</BODY></HTML>