« »

This JavaScript changes the color of the scrollbar between two preset values. You can set the beginning color, the ending color, the number of color changes between the two, and the delay between changes.

Label: Scrollbar Color Fader script

Report to us error of this JavaScript

Demo
Enlarge
Reload
New window

Code
JavaScript
Print

Copy All x2

<script language="javascript">

var begcolor='#0084d8';        //STARTING COLOR AS A HEX STRING
var endcolor='#00385c';        //ENDING COLOR AS A HEX STRING
var steps=50;                          //TOTAL CHANGE STEPS FROM ONE COLOR TO THE OTHER
var delay=50;                          // DELAY BETWEEN EACH COLOR CHANGE. LOWER IS FASTER.

//*** DO NOT EDIT BEYOND THIS POINT ***\\

var data=new Array();
var ie5=(document.getElementById && document.all)? true: false;

function colorset(num){
this.beg=parseInt('0x'+begcolor.substring(num,num+2));
this.end=parseInt('0x'+endcolor.substring(num,num+2));
this.up=this.startup=(this.end>=this.beg)? true : false;
this.incr=Math.abs(this.end-this.beg)/steps;
this.current=this.beg;
}

function changecolors(){
var color=new Array();
for(i=1;i<=3; i++){
(data[i].up)? data[i].current+=data[i].incr : data[i].current-=data[i].incr;
if(data[i].startup){
if(data[i].current>=data[i].end){ data[i].up=false; data[i].current=data[i].end}
if(data[i].current<=data[i].beg){ data[i].up=true; data[i].current=data[i].beg }
}
if(!data[i].startup){
if(data[i].current<=data[i].end){ data[i].up=true; data[i].current=data[i].end}
if(data[i].current>=data[i].beg){ data[i].up=false; data[i].current=data[i].beg}
}
color[i]=data[i].current;
}
color[4]=Math.floor(color[1]).toString(16); if(color[4].length==1)color[4]='0'+color[4];
color[5]=Math.floor(color[2]).toString(16); if(color[5].length==1)color[5]='0'+color[5];
color[6]=Math.floor(color[3]).toString(16); if(color[6].length==1)color[6]='0'+color[6];
document.body.style.scrollbarBaseColor='#'+color[4]+color[5]+color[6];
}

window.onload=function(){
if(ie5){
for(i=1, j=1;i<=3; i++, j+=2)data[i]=new colorset(j);
document.body.style.scrollbarBaseColor=begcolor;
setInterval('changecolors()',delay);
}else alert('This script only works for Internet Explorer browsers version 5.5 and up.');
}

</script>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->