Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Nov 2009
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Disco Background effect to work with Text and Images

    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

  • #2
    Regular Coder
    Join Date
    Oct 2006
    Posts
    107
    Thanks
    3
    Thanked 5 Times in 5 Posts
    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=stepsfbgc(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> 
    Last edited by rubenbuhr; 11-23-2009 at 05:52 AM. Reason: negative numbers in rgb?


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •