Full version: jsB@nk » Background » Fading background » Bar Animator
URL: https://www.javascriptbank.com/bar-animator.html
Create animated bars fadeing through a set of random or selectable colors. Add as many horizontal or vertical bars as you like. Easy configuration of colors, width, length, speed and type of gradient-effect. Two different gradient-effects for IE5x. Standard effect for NS6x/7x and Opera7x.
Full version: jsB@nk » Background » Fading background » Bar Animator
URL: https://www.javascriptbank.com/bar-animator.html
<script language="javascript">/* This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com*/// Bar Animator, random colors///////////////////////////////////////////////////////////////////////////// CONFIGURATION STARTS HERE///////////////////////////////////////////////////////////////////////////// Select fade-effect below:// Set 1 if the background may fade from dark to medium // Set 2 if the background may fade from light to medium // Set 3 if the background may fade from very dark to very light light// Set 4 if the background may fade from light to very light// Set 5 if the background may fade from dark to very dark var fade_effect=3// Set speed (higher=slower)var speed=20///////////////////////////////////////////////////////////////////////////// CONFIGURATION ENDS HERE///////////////////////////////////////////////////////////////////////////var gradient_effect=new Array()var flipcol=new Array()var gr_effect=1var i_barcount=0var browserinfos=navigator.userAgent var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)var ns6=document.getElementById&&!document.allvar opera=browserinfos.match(/Opera/) var browserok=ie5||ns6||operaif (fade_effect==1) {var darkmax=1var lightmax=127}if (fade_effect==2) {var darkmax=127var lightmax=254}if (fade_effect==3) {var darkmax=1var lightmax=254}if (fade_effect==4) {var darkmax=190var lightmax=254}if (fade_effect==5) {var darkmax=1var lightmax=80}var hexc = new Array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F')var newredvar newgreenvar newbluevar oldredvar oldgreenvar oldbluevar redcol_1var redcol_2 var greencol_1 var greencol_2 var bluecol_1 var bluecol_2 var oldcolorvar newcolorvar newcolorComplvar firsttime=true var stepred=1var stepgreen=1var stepblue=1function setrandomcolor() {var range=(lightmax-darkmax)if (firsttime) {newred=Math.ceil(range*Math.random())+darkmaxnewgreen=Math.ceil(range*Math.random())+darkmaxnewblue=Math.ceil(range*Math.random())+darkmaxfirsttime=false}oldred=Math.ceil(range*Math.random())+darkmaxoldgreen=Math.ceil(range*Math.random())+darkmaxoldblue=Math.ceil(range*Math.random())+darkmaxstepred=newred-oldredif (oldred>newred) {stepred=1}else if (oldred<newred) {stepred=-1}else {stepred=0}stepgreen=newgreen-oldgreenif (oldgreen>newgreen) {stepgreen=1}else if (oldgreen<newgreen) {stepgreen=-1}else {stepgreen=0}stepblue=newblue-oldblueif (oldblue>newblue) {stepblue=1}else if (oldblue<newblue) {stepblue=-1}else {stepblue=0}fadebg()}function fadebg() {if (newred==oldred) {stepred=0}if (newgreen==oldgreen) {stepgreen=0}if (newblue==oldblue) {stepblue=0}newred+=steprednewgreen+=stepgreennewblue+=stepblueif (stepred!=0 || stepgreen!=0 || stepblue!=0) { redcol_1 = hexc[Math.floor(newred/16)]; redcol_2 = hexc[newred%16]; greencol_1 = hexc[Math.floor(newgreen/16)]; greencol_2 = hexc[newgreen%16]; bluecol_1 = hexc[Math.floor(newblue/16)]; bluecol_2 = hexc[newblue%16]; newcolor="#"+redcol_1+redcol_2+greencol_1+greencol_2+bluecol_1+bluecol_2 greencol_1 = hexc[Math.floor(newred/16)]; greencol_2 = hexc[newred%16]; bluecol_1 = hexc[Math.floor(newgreen/16)]; bluecol_2 = hexc[newgreen%16]; redcol_1 = hexc[Math.floor(newblue/16)]; redcol_2 = hexc[newblue%16];newcolorCompl="#"+redcol_1+redcol_2+greencol_1+greencol_2+bluecol_1+bluecol_2for (i=0;i<=i_barcount-1;i++) {if (ie5 && gradient_effect[i]!="none") {if (gradient_effect[i]=="horizontal") {gr_effect=1}if (gradient_effect[i]=="vertical") {gr_effect=0}if (flipcol[i]=="yes") {document.getElementById('anibar'+i).style.filter="progid:DXImageTransform.Microsoft.Gradient(startColorstr="+newcolorCompl+", endColorstr="+newcolor+" GradientType="+gr_effect+")"}else {document.getElementById('anibar'+i).style.filter="progid:DXImageTransform.Microsoft.Gradient(startColorstr="+newcolor+", endColorstr="+newcolorCompl+" GradientType="+gr_effect+")"}}else {if (flipcol[i]=="yes") { document.getElementById('anibar'+i).style.backgroundColor=newcolor }else {document.getElementById('anibar'+i).style.backgroundColor=newcolorCompl }}}var timer=setTimeout("fadebg()",speed); } else { clearTimeout(timer)newred=oldrednewgreen=oldgreennewblue=oldbluesetrandomcolor() }}function addbar(barwidth,barheight,gradienttype,flipcolor) {if (browserok) {gradient_effect[i_barcount]=gradienttypeflipcol[i_barcount]=flipcolordocument.write('<table border=0 cellpadding=0 cellspacing=0 width='+barwidth+' height='+barheight+' border=0><tr><td><div id="roof'+i_barcount+'" style="position:relative;width:'+barwidth+'px;height:'+barheight+'px;"><div id="anibar'+i_barcount+'" style="position:absolute;top:0px;left:0px;width:'+barwidth+'px;height:'+barheight+'px;"><img src="empty.gif" width='+barwidth+' height='+barheight+'></div></div></td></tr></table>')i_barcount++}}if (browserok) {window.onload=setrandomcolor}</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><script>addbar(500,10,"vertical","yes")</script><br><script>addbar(500,10,"horizontal","yes")</script><br><script>addbar(500,10,"horizontal","yes")</script><br><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->