Full version: jsB@nk » Text » Fade-Glow » Colourx gradient changer
URL: https://www.javascriptbank.com/colourx-gradient-changer.html
This JavaScript changes colour gradient of text.
Full version: jsB@nk » Text » Fade-Glow » Colourx gradient changer
URL: https://www.javascriptbank.com/colourx-gradient-changer.html
<SCRIPT language=javascript><!--/* offset variable affects how smoothly it changes colour -smoothest and slowest is 1 - top is about 20 but it can go higher but you wont see much happen */var offset = 10;/* Div name we want to change the colour of */var targetDiv1 = 'colourx1';var targetDiv2 = 'colourx2';/* modify this function to add extra divs to be coloured */function docolouring(colorx){/* ie / mozilla test */if(document.all){o = document.all[targetDiv1];o2 = document.all[targetDiv2];}else{o = document.getElementById(targetDiv1); o2 = document.getElementById(targetDiv2); }o.style.color = colorx;o2.style.color = colorx;}function init() {/* create currect colour value settings you can either use random settings as here or give them rgb colour values (number between 0 and 255) eg:rc = 255; gc = 0; bc = 0; */ rc = generateRandomNumber(); gc = generateRandomNumber(); bc = generateRandomNumber();/* call the loop function */colourX(rc,gc,bc);}function colourX(rc, gc, bc){/* create numbers to count to */ red_dec = generateRandomNumber(); green_dec = generateRandomNumber(); blue_dec = generateRandomNumber();/* just make sure that this isnt set to somthing stupid */if(offset < 0 || offset > 40){offset = 1;}/* logic to count towards the targets */if(rc < red_dec){rc+=offset;}else if(rc > red_dec){rc-=offset;}else{red_dec = generateRandomNumber();}if(gc < green_dec){gc+=offset;}else if(gc > green_dec){gc-=offset;}else{green_dec = generateRandomNumber();}if(bc < blue_dec){bc+=offset;}else if(bc > blue_dec){bc-=offset;}else{blue_dec = generateRandomNumber();} /* convert the current colour values to hexadecimal */base = 16; hexr = convDecTo( rc, base ); hexg = convDecTo( gc, base ); hexb = convDecTo( bc, base );/* create the colour hex string */ var colorx = ([hexr]+[hexg]+[hexb]);/* colour the div */docolouring(colorx);/* back round we go... */ setTimeout("colourX("+rc+","+ gc+","+ bc+")", 0010);}function generateRandomNumber(){ rand = Math.random();rand = rand * 1000; rand = parseInt ( rand ); if( rand > 255 ) {generateRandomNumber(); } return rand;}function convDecTo( i, base ){/* this keeps it from breaking when the offset is set to something greater than 1 */ if(i > 255){return('FF'); } else if(i < 0 ){ return('00'); }else{ num = parseInt( i ); num = num.toString(base); if (i<base) {num = ("0" + num); } return num; }}//--></SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><BODY onload=init();><FONT size=+4><DIV id=colourx1 style="LEFT: 400px; POSITION: absolute; TOP: 300px; Z-INDEX: 2">JavaScriptBank.com</DIV><DIV id=blackdiv style="COLOR: #000000; LEFT: 401px; POSITION: absolute; TOP: 301px; Z-INDEX: 1">JavaScriptBank.com</DIV></FONT><DIV id=colourx2 style="LEFT: 400px; POSITION: absolute; TOP: 351px; Z-INDEX: 4">JavaScriptBank.com</DIV><DIV id=blackdiv2 style="COLOR: #000000; LEFT: 401px; POSITION: absolute; TOP: 352px; Z-INDEX: 3">JavaScriptBank.com</DIV><DIV id=blackdiv2 style="COLOR: #000000; LEFT: 551px; POSITION: absolute; TOP: 372px; Z-INDEX: 20">JavaScriptBank.com</DIV></BODY><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->