Full version: jsB@nk » Utility » Simple JavaScript Scrollbar Maker
URL: https://www.javascriptbank.com/simple-javascript-scrollbar-maker.html
Make colored, flat-style, and blinking scrollbars... striking effects that definitely get attention. Make your scrollbar colorful.
Full version: jsB@nk » Utility » Simple JavaScript Scrollbar Maker
URL: https://www.javascriptbank.com/simple-javascript-scrollbar-maker.html
<STYLE>.color {BACKGROUND-COLOR: #ffffff; BORDER-BOTTOM: black 1px solid; BORDER-LEFT: black 1px solid; BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; HEIGHT: 23px; WIDTH: 65px}</STYLE><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><SCRIPT><!--function act(form){var c1,c2,c3,c4line1.style.backgroundColor="#ffffff"face1.style.backgroundColor="#ffffff"line2.style.backgroundColor="#ffffff"face2.style.backgroundColor="#ffffff"function changecontent(){if (form.type[1].checked) {type1='"white"';type2='"gray"';type3='"white"'} else {type1='line';type2='face';type3='face'}c1=line1.style.backgroundColorc2=face1.style.backgroundColorc3=line2.style.backgroundColorc4=face2.style.backgroundColorfunction clrBar(line,face){with(document.body.style){scrollbarDarkShadowColor=line;scrollbar3dLightColor=form.type[1].checked?"white":line;scrollbarArrowColor="black";scrollbarBaseColor=face;scrollbarFaceColor=face;scrollbarHighlightColor=form.type[1].checked?"white":face;scrollbarShadowColor=form.type[1].checked?"gray":face;scrollbarTrackColor="#F3F3F3";}}function setcolor(){var w = document.body.clientWidth;var h = document.body.clientHeight;var x = event.clientX;var y = event.clientY;if(x>w) clrBar(c1,c2); // Your colorselse clrBar(c3,c4); // A predefined theme}if (document.all){clrBar(null,null);document.onmousemove=setcolor}endtag=' scrollbars. Colors: line1 - '+c1+', line2 - '+c3+', face1 - '+c2+', face2 - '+c4+'*/\n'text=form.type[1].checked?'/*---For 3D'+endtag:'/*---For flat'+endtagcontent='<script language="JavaScript1.2">\n'+'<!--\n'+text+'function clrBar(line,face)\n'+'{\n'+'with(document.body.style)\n'+'{\n'+'scrollbarDarkShadowColor=line;\n'+'scrollbar3dLightColor='+type1+';\n'+'scrollbarArrowColor="black";\n'+'scrollbarBaseColor=face;\n'+'scrollbarFaceColor=face;\n'+'scrollbarHighlightColor='+type3+';\n'+'scrollbarShadowColor='+type2+';\n'+'scrollbarTrackColor="#F3F3F3";\n'+'}\n'+'}\n'+'function setcolor()\n'+'{\n'+'var w = document.body.clientWidth;\n'+'var h = document.body.clientHeight;\n'+'var x = event.clientX;\n'+'var y = event.clientY;\n'+'if(x>w) clrBar("'+c1+'","'+c2+'"); // Colors of active state\n'+'else clrBar("'+c3+'","'+c4+'"); // Colors of normal state\n'+'}\n'+'if (document.all){\n'+'clrBar(null,null);\n'+'document.onmousemove=setcolor;\n'+'}\n'+'//------- Source Code Generator - La Minh Khanh ------ //\n'+'-->\n<'+'/script>'form.codearea.value=content}form.gen.onclick=changecontentform.copy.onclick=function copy() {myForm.codearea.select(); myForm.codearea.focus();textRange = myForm.codearea.createTextRange();textRange.execCommand("RemoveFormat");textRange.execCommand("Copy");alert("The code has been copied into your clipboard!")}}//end of act()--></SCRIPT><P>Guide: Put the generated script on the <body> part of your web page. Lets note that this script works with IE5.5+, other browsers just ignore it.</P><P>Color table: Enter the color number or click on a cell to choose your color.</P><SCRIPT><!--function ilus(clr){selhex.value=clrselcolor.style.backgroundColor=clr}function passclr(pass){if(selhex.value.length == 7) ilus(pass)}--></SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><BODY onload=act(document.myForm)><TABLE border=0 cellPadding=0 cellSpacing=1> <TBODY> <TR> <TD bgColor=#00ff00 height=15 onclick="ilus('#00FF00')" width=20></TD> <TD bgColor=#00ff33 height=15 onclick="ilus('#00FF33')" width=20></TD> <TD bgColor=#00ff66 height=15 onclick="ilus('#00FF66')" width=20></TD> <TD bgColor=#00ff99 height=15 onclick="ilus('#00FF99')" width=20></TD> <TD bgColor=#00ffcc height=15 onclick="ilus('#00FFCC')" width=20></TD> <TD bgColor=#00ffff height=15 onclick="ilus('#00FFFF')" width=20></TD> <TD bgColor=#00cc00 height=15 onclick="ilus('#00CC00')" width=20></TD> <TD bgColor=#00cc66 height=15 onclick="ilus('#00CC66')" width=20></TD> <TD bgColor=#00cc66 height=15 onclick="ilus('#00CC66')" width=20></TD> <TD bgColor=#00cc99 height=15 onclick="ilus('#00CC99')" width=20></TD> <TD bgColor=#00cccc height=15 onclick="ilus('#00CCCC')" width=20></TD> <TD bgColor=#00ccff height=15 onclick="ilus('#00CCFF')" width=20></TD> <TD bgColor=#009900 height=15 onclick="ilus('#009900')" width=20></TD> <TD bgColor=#009933 height=15 onclick="ilus('#009933')" width=20></TD> <TD bgColor=#009966 height=15 onclick="ilus('#009966')" width=20></TD> <TD bgColor=#009999 height=15 onclick="ilus('#009999')" width=20></TD> <TD bgColor=#0099cc height=15 onclick="ilus('#0099CC')" width=20></TD> <TD bgColor=#0099ff height=15 onclick="ilus('#0099FF')" width=20></TD></TR> <TR> <TD bgColor=#33ff00 height=15 onclick="ilus('#33FF00')" width=20></TD> <TD bgColor=#33ff33 height=15 onclick="ilus('#33FF33')" width=20></TD> <TD bgColor=#33ff66 height=15 onclick="ilus('#33FF66')" width=20></TD> <TD bgColor=#33ff99 height=15 onclick="ilus('#33FF99')" width=20></TD> <TD bgColor=#33ffcc height=15 onclick="ilus('#33FFCC')" width=20></TD> <TD bgColor=#33ffff height=15 onclick="ilus('#33FFFF')" width=20></TD> <TD bgColor=#33cc00 height=15 onclick="ilus('#33CC00')" width=20></TD> <TD bgColor=#33cc33 height=15 onclick="ilus('#33CC33')" width=20></TD> <TD bgColor=#33cc66 height=15 onclick="ilus('#33CC66')" width=20></TD> <TD bgColor=#33cc99 height=15 onclick="ilus('#33CC99')" width=20></TD> <TD bgColor=#33cccc height=15 onclick="ilus('#33CCCC')" width=20></TD> <TD bgColor=#33ccff height=15 onclick="ilus('#33CCFF')" width=20></TD> <TD bgColor=#339900 height=15 onclick="ilus('#339900')" width=20></TD> <TD bgColor=#339933 height=15 onclick="ilus('#339933')" width=20></TD> <TD bgColor=#339966 height=15 onclick="ilus('#339966')" width=20></TD> <TD bgColor=#339999 height=15 onclick="ilus('#339999')" width=20></TD> <TD bgColor=#3399cc height=15 onclick="ilus('#3399CC')" width=20></TD> <TD bgColor=#3399ff height=15 onclick="ilus('#3399FF')" width=20></TD></TR> <TR> <TD bgColor=#66ff00 height=15 onclick="ilus('#66FF00')" width=20></TD> <TD bgColor=#66ff33 height=15 onclick="ilus('#66FF33')" width=20></TD> <TD bgColor=#66ff66 height=15 onclick="ilus('#66FF66')" width=20></TD> <TD bgColor=#66ff99 height=15 onclick="ilus('#66FF99')" width=20></TD> <TD bgColor=#66ffcc height=15 onclick="ilus('#66FFCC')" width=20></TD> <TD bgColor=#66ffff height=15 onclick="ilus('#66FFFF')" width=20></TD> <TD bgColor=#66cc00 height=15 onclick="ilus('#66CC00')" width=20></TD> <TD bgColor=#66cc33 height=15 onclick="ilus('#66CC33')" width=20></TD> <TD bgColor=#66cc66 height=15 onclick="ilus('#66CC66')" width=20></TD> <TD bgColor=#66cc99 height=15 onclick="ilus('#66CC99')" width=20></TD> <TD bgColor=#66cccc height=15 onclick="ilus('#66CCCC')" width=20></TD> <TD bgColor=#66ccff height=15 onclick="ilus('#66CCFF')" width=20></TD> <TD bgColor=#669900 height=15 onclick="ilus('#669900')" width=20></TD> <TD bgColor=#669933 height=15 onclick="ilus('#669933')" width=20></TD> <TD bgColor=#669966 height=15 onclick="ilus('#669966')" width=20></TD> <TD bgColor=#669999 height=15 onclick="ilus('#669999')" width=20></TD> <TD bgColor=#6699cc height=15 onclick="ilus('#6699CC')" width=20></TD> <TD bgColor=#6699ff height=15 onclick="ilus('#6699FF')" width=20></TD></TR> <TR> <TD bgColor=#99ff00 height=15 onclick="ilus('#99FF00')" width=20></TD> <TD bgColor=#99ff33 height=15 onclick="ilus('#99FF33')" width=20></TD> <TD bgColor=#99ff66 height=15 onclick="ilus('#99FF66')" width=20></TD> <TD bgColor=#99ff99 height=15 onclick="ilus('#99FF99')" width=20></TD> <TD bgColor=#99ffcc height=15 onclick="ilus('#99FFCC')" width=20></TD> <TD bgColor=#99ffff height=15 onclick="ilus('#99FFFF')" width=20></TD> <TD bgColor=#99cc00 height=15 onclick="ilus('#99CC00')" width=20></TD> <TD bgColor=#99cc33 height=15 onclick="ilus('#99CC33')" width=20></TD> <TD bgColor=#99cc66 height=15 onclick="ilus('#99CC66')" width=20></TD> <TD bgColor=#99cc99 height=15 onclick="ilus('#99CC99')" width=20></TD> <TD bgColor=#99cccc height=15 onclick="ilus('#99CCCC')" width=20></TD> <TD bgColor=#99ccff height=15 onclick="ilus('#99CCFF')" width=20></TD> <TD bgColor=#999900 height=15 onclick="ilus('#999900')" width=20></TD> <TD bgColor=#999933 height=15 onclick="ilus('#999933')" width=20></TD> <TD bgColor=#999966 height=15 onclick="ilus('#999966')" width=20></TD> <TD bgColor=#999999 height=15 onclick="ilus('#999999')" width=20></TD> <TD bgColor=#9999cc height=15 onclick="ilus('#9999CC')" width=20></TD> <TD bgColor=#9999ff height=15 onclick="ilus('#9999FF')" width=20></TD></TR> <TR> <TD bgColor=#ccff00 height=15 onclick="ilus('#CCFF00')" width=20></TD> <TD bgColor=#ccff33 height=15 onclick="ilus('#CCFF33')" width=20></TD> <TD bgColor=#ccff66 height=15 onclick="ilus('#CCFF66')" width=20></TD> <TD bgColor=#ccff99 height=15 onclick="ilus('#CCFF99')" width=20></TD> <TD bgColor=#ccffcc height=15 onclick="ilus('#CCFFCC')" width=20></TD> <TD bgColor=#ccffff height=15 onclick="ilus('#CCFFFF')" width=20></TD> <TD bgColor=#cccc00 height=15 onclick="ilus('#CCCC00')" width=20></TD> <TD bgColor=#cccc33 height=15 onclick="ilus('#CCCC33')" width=20></TD> <TD bgColor=#cccc66 height=15 onclick="ilus('#CCCC66')" width=20></TD> <TD bgColor=#cccc99 height=15 onclick="ilus('#CCCC99')" width=20></TD> <TD bgColor=#cccccc height=15 onclick="ilus('#CCCCCC')" width=20></TD> <TD bgColor=#ccccff height=15 onclick="ilus('#CCCCFF')" width=20></TD> <TD bgColor=#cc9900 height=15 onclick="ilus('#CC9900')" width=20></TD> <TD bgColor=#cc9933 height=15 onclick="ilus('#CC9933')" width=20></TD> <TD bgColor=#cc9966 height=15 onclick="ilus('#CC9966')" width=20></TD> <TD bgColor=#cc9999 height=15 onclick="ilus('#CC9999')" width=20></TD> <TD bgColor=#cc99cc height=15 onclick="ilus('#CC99CC')" width=20></TD> <TD bgColor=#cc99ff height=15 onclick="ilus('#CC99FF')" width=20></TD></TR> <TR> <TD bgColor=#ffff00 height=15 onclick="ilus('#FFFF00')" width=20></TD> <TD bgColor=#ffff33 height=15 onclick="ilus('#FFFF33')" width=20></TD> <TD bgColor=#ffff66 height=15 onclick="ilus('#FFFF66')" width=20></TD> <TD bgColor=#ffff99 height=15 onclick="ilus('#FFFF99')" width=20></TD> <TD bgColor=#ffffcc height=15 onclick="ilus('#FFFFCC')" width=20></TD> <TD bgColor=#ffffff height=15 onclick="ilus('#FFFFFF')" width=20></TD> <TD bgColor=#ffcc00 height=15 onclick="ilus('#FFCC00')" width=20></TD> <TD bgColor=#ffcc33 height=15 onclick="ilus('#FFCC33')" width=20></TD> <TD bgColor=#ffcc66 height=15 onclick="ilus('#FFCC66')" width=20></TD> <TD bgColor=#ffcc99 height=15 onclick="ilus('#FFCC99')" width=20></TD> <TD bgColor=#ffcccc height=15 onclick="ilus('#FFCCCC')" width=20></TD> <TD bgColor=#ffccff height=15 onclick="ilus('#FFCCFF')" width=20></TD> <TD bgColor=#ff9900 height=15 onclick="ilus('#FF9900')" width=20></TD> <TD bgColor=#ff9933 height=15 onclick="ilus('#FF9933')" width=20></TD> <TD bgColor=#ff9966 height=15 onclick="ilus('#FF9966')" width=20></TD> <TD bgColor=#ff9999 height=15 onclick="ilus('#FF9999')" width=20></TD> <TD bgColor=#ff99cc height=15 onclick="ilus('#FF99CC')" width=20></TD> <TD bgColor=#ff99ff height=15 onclick="ilus('#FF99FF')" width=20></TD></TR> <TR> <TD bgColor=#006600 height=15 onclick="ilus('#006600')" width=20></TD> <TD bgColor=#006633 height=15 onclick="ilus('#006633')" width=20></TD> <TD bgColor=#006666 height=15 onclick="ilus('#006666')" width=20></TD> <TD bgColor=#006699 height=15 onclick="ilus('#006699')" width=20></TD> <TD bgColor=#0066cc height=15 onclick="ilus('#0066CC')" width=20></TD> <TD bgColor=#0066ff height=15 onclick="ilus('#0066FF')" width=20></TD> <TD bgColor=#003300 height=15 onclick="ilus('#003300')" width=20></TD> <TD bgColor=#003333 height=15 onclick="ilus('#003333')" width=20></TD> <TD bgColor=#003366 height=15 onclick="ilus('#003366')" width=20></TD> <TD bgColor=#003399 height=15 onclick="ilus('#003399')" width=20></TD> <TD bgColor=#0033cc height=15 onclick="ilus('#0033CC')" width=20></TD> <TD bgColor=#0033ff height=15 onclick="ilus('#0033FF')" width=20></TD> <TD bgColor=#000000 height=15 onclick="ilus('#000000')" width=20></TD> <TD bgColor=#000033 height=15 onclick="ilus('#000033')" width=20></TD> <TD bgColor=#000066 height=15 onclick="ilus('#000066')" width=20></TD> <TD bgColor=#000099 height=15 onclick="ilus('#000099')" width=20></TD> <TD bgColor=#0000cc height=15 onclick="ilus('#0000CC')" width=20></TD> <TD bgColor=#0000ff height=15 onclick="ilus('#0000FF')" width=20></TD></TR> <TR> <TD bgColor=#336600 height=15 onclick="ilus('#336600')" width=20></TD> <TD bgColor=#336633 height=15 onclick="ilus('#336633')" width=20></TD> <TD bgColor=#336666 height=15 onclick="ilus('#336666')" width=20></TD> <TD bgColor=#336699 height=15 onclick="ilus('#336699')" width=20></TD> <TD bgColor=#3366cc height=15 onclick="ilus('#3366CC')" width=20></TD> <TD bgColor=#3366ff height=15 onclick="ilus('#3366FF')" width=20></TD> <TD bgColor=#333300 height=15 onclick="ilus('#333300')" width=20></TD> <TD bgColor=#333333 height=15 onclick="ilus('#333333')" width=20></TD> <TD bgColor=#333366 height=15 onclick="ilus('#333366')" width=20></TD> <TD bgColor=#333399 height=15 onclick="ilus('#333399')" width=20></TD> <TD bgColor=#3333cc height=15 onclick="ilus('#3333CC')" width=20></TD> <TD bgColor=#3333ff height=15 onclick="ilus('#3333FF')" width=20></TD> <TD bgColor=#330000 height=15 onclick="ilus('#330000')" width=20></TD> <TD bgColor=#330033 height=15 onclick="ilus('#330033')" width=20></TD> <TD bgColor=#330066 height=15 onclick="ilus('#330066')" width=20></TD> <TD bgColor=#330099 height=15 onclick="ilus('#330099')" width=20></TD> <TD bgColor=#3300cc height=15 onclick="ilus('#3300CC')" width=20></TD> <TD bgColor=#3300ff height=15 onclick="ilus('#3300FF')" width=20></TD></TR> <TR> <TD bgColor=#666600 height=15 onclick="ilus('#666600')" width=20></TD> <TD bgColor=#666633 height=15 onclick="ilus('#666633')" width=20></TD> <TD bgColor=#666666 height=15 onclick="ilus('#666666')" width=20></TD> <TD bgColor=#666699 height=15 onclick="ilus('#666699')" width=20></TD> <TD bgColor=#6666cc height=15 onclick="ilus('#6666CC')" width=20></TD> <TD bgColor=#6666ff height=15 onclick="ilus('#6666FF')" width=20></TD> <TD bgColor=#663300 height=15 onclick="ilus('#663300')" width=20></TD> <TD bgColor=#663333 height=15 onclick="ilus('#663333')" width=20></TD> <TD bgColor=#663366 height=15 onclick="ilus('#663366')" width=20></TD> <TD bgColor=#663399 height=15 onclick="ilus('#663399')" width=20></TD> <TD bgColor=#6633cc height=15 onclick="ilus('#6633CC')" width=20></TD> <TD bgColor=#6633ff height=15 onclick="ilus('#6633FF')" width=20></TD> <TD bgColor=#660000 height=15 onclick="ilus('#660000')" width=20></TD> <TD bgColor=#660033 height=15 onclick="ilus('#660033')" width=20></TD> <TD bgColor=#660066 height=15 onclick="ilus('#660066')" width=20></TD> <TD bgColor=#660099 height=15 onclick="ilus('#660099')" width=20></TD> <TD bgColor=#6600cc height=15 onclick="ilus('#6600CC')" width=20></TD> <TD bgColor=#6600ff height=15 onclick="ilus('#6600FF')" width=20></TD></TR> <TR> <TD bgColor=#996600 height=15 onclick="ilus('#996600')" width=20></TD> <TD bgColor=#996633 height=15 onclick="ilus('#996633')" width=20></TD> <TD bgColor=#996666 height=15 onclick="ilus('#996666')" width=20></TD> <TD bgColor=#996699 height=15 onclick="ilus('#996699')" width=20></TD> <TD bgColor=#9966cc height=15 onclick="ilus('#9966CC')" width=20></TD> <TD bgColor=#9966ff height=15 onclick="ilus('#9966FF')" width=20></TD> <TD bgColor=#993300 height=15 onclick="ilus('#993300')" width=20></TD> <TD bgColor=#993333 height=15 onclick="ilus('#993333')" width=20></TD> <TD bgColor=#993366 height=15 onclick="ilus('#993366')" width=20></TD> <TD bgColor=#993399 height=15 onclick="ilus('#993399')" width=20></TD> <TD bgColor=#9933cc height=15 onclick="ilus('#9933CC')" width=20></TD> <TD bgColor=#9933ff height=15 onclick="ilus('#9933FF')" width=20></TD> <TD bgColor=#990000 height=15 onclick="ilus('#990000')" width=20></TD> <TD bgColor=#990033 height=15 onclick="ilus('#990033')" width=20></TD> <TD bgColor=#990066 height=15 onclick="ilus('#990066')" width=20></TD> <TD bgColor=#990099 height=15 onclick="ilus('#990099')" width=20></TD> <TD bgColor=#9900cc height=15 onclick="ilus('#9900CC')" width=20></TD> <TD bgColor=#9900ff height=15 onclick="ilus('#9900FF')" width=20></TD></TR> <TR> <TD bgColor=#cc6600 height=15 onclick="ilus('#CC6600')" width=20></TD> <TD bgColor=#cc6633 height=15 onclick="ilus('#CC6633')" width=20></TD> <TD bgColor=#cc6666 height=15 onclick="ilus('#CC6666')" width=20></TD> <TD bgColor=#cc6699 height=15 onclick="ilus('#CC6699')" width=20></TD> <TD bgColor=#cc66cc height=15 onclick="ilus('#CC66CC')" width=20></TD> <TD bgColor=#cc66ff height=15 onclick="ilus('#CC66FF')" width=20></TD> <TD bgColor=#cc3300 height=15 onclick="ilus('#CC3300')" width=20></TD> <TD bgColor=#cc3333 height=15 onclick="ilus('#CC3333')" width=20></TD> <TD bgColor=#cc3366 height=15 onclick="ilus('#CC3366')" width=20></TD> <TD bgColor=#cc3399 height=15 onclick="ilus('#CC3399')" width=20></TD> <TD bgColor=#cc33cc height=15 onclick="ilus('#CC33CC')" width=20></TD> <TD bgColor=#cc33ff height=15 onclick="ilus('#CC33FF')" width=20></TD> <TD bgColor=#cc0000 height=15 onclick="ilus('#CC0000')" width=20></TD> <TD bgColor=#cc0033 height=15 onclick="ilus('#CC0033')" width=20></TD> <TD bgColor=#cc0066 height=15 onclick="ilus('#CC0066')" width=20></TD> <TD bgColor=#cc0099 height=15 onclick="ilus('#CC0099')" width=20></TD> <TD bgColor=#cc00cc height=15 onclick="ilus('#CC00CC')" width=20></TD> <TD bgColor=#cc00ff height=15 onclick="ilus('#CC00FF')" width=20></TD></TR> <TR> <TD bgColor=#ff6600 height=15 onclick="ilus('#FF6600')" width=20></TD> <TD bgColor=#ff6633 height=15 onclick="ilus('#FF6633')" width=20></TD> <TD bgColor=#ff6666 height=15 onclick="ilus('#FF6666')" width=20></TD> <TD bgColor=#ff6699 height=15 onclick="ilus('#FF6699')" width=20></TD> <TD bgColor=#ff66cc height=15 onclick="ilus('#FF66CC')" width=20></TD> <TD bgColor=#ff66ff height=15 onclick="ilus('#FF66FF')" width=20></TD> <TD bgColor=#ff3300 height=15 onclick="ilus('#FF3300')" width=20></TD> <TD bgColor=#ff3333 height=15 onclick="ilus('#FF3333')" width=20></TD> <TD bgColor=#ff3366 height=15 onclick="ilus('#FF3366')" width=20></TD> <TD bgColor=#ff3399 height=15 onclick="ilus('#FF3399')" width=20></TD> <TD bgColor=#ff33cc height=15 onclick="ilus('#FF33CC')" width=20></TD> <TD bgColor=#ff33ff height=15 onclick="ilus('#FF33FF')" width=20></TD> <TD bgColor=#ff0000 height=15 onclick="ilus('#FF0000')" width=20></TD> <TD bgColor=#ff0033 height=15 onclick="ilus('#FF0033')" width=20></TD> <TD bgColor=#ff0066 height=15 onclick="ilus('#FF0066')" width=20></TD> <TD bgColor=#ff0099 height=15 onclick="ilus('#FF0099')" width=20></TD> <TD bgColor=#ff00cc height=15 onclick="ilus('#FF00CC')" width=20></TD> <TD bgColor=#ff00ff height=15 onclick="ilus('#FF00FF')" width=20></TD></TR></TBODY></TABLE><TABLE border=0 cellPadding=0 cellSpacing=1> <TBODY> <TR> <TD bgColor=#ffffff height=15 onclick="ilus('#FFFFFF')" width=20></TD> <TD bgColor=#dddddd height=15 onclick="ilus('#DDDDDD')" width=20></TD> <TD bgColor=#c0c0c0 height=15 onclick="ilus('#C0C0C0')" width=20></TD> <TD bgColor=#969696 height=15 onclick="ilus('#969696')" width=20></TD> <TD bgColor=#808080 height=15 onclick="ilus('#808080')" width=20></TD> <TD bgColor=#646464 height=15 onclick="ilus('#646464')" width=20></TD> <TD bgColor=#4b4b4b height=15 onclick="ilus('#4B4B4B')" width=20></TD> <TD bgColor=#242424 height=15 onclick="ilus('#242424')" width=20></TD> <TD bgColor=#000000 height=15 onclick="ilus('#000000')" width=20></TD></TR></TBODY></TABLE><P><INPUT class=color name=selhex onchange=passclr(this.value) value=#FFFFFF size="20"> <INPUT class=color name=selcolor onfocus=this.blur() size="20"> Chosen color</P><P>1. Set color for your scrollbars when it is actived (mouse over). Tip: you would better set the face color lighter the line color.</P><P><INPUT name=s1 onclick=line1.style.backgroundColor=selcolor.style.backgroundColor type=button value="Set Color"> <INPUT class=color name=line1 onfocus=this.blur() size="20"> Line color<BR><INPUT name=s2 onclick=face1.style.backgroundColor=selcolor.style.backgroundColor type=button value="Set Color"> <INPUT class=color name=face1 onfocus=this.blur() size="20"> Face color</P><P>2. And set the colors for scrollbars in normal state here, choose the color you like from above table and click <B>Set Color</B>:</P><P><INPUT name=s3 onclick=line2.style.backgroundColor=selcolor.style.backgroundColor type=button value="Set Color"> <INPUT class=color name=line2 onfocus=this.blur() size="20"> Line color<BR><INPUT name=s4 onclick=face2.style.backgroundColor=selcolor.style.backgroundColor type=button value="Set Color"> <INPUT class=color name=face2 onfocus=this.blur() size="20"> Face color</P><P>3. Finally set a type of scrollbars you want and click <B>Generate Source Code</B>, you will see the illustration on scrollbars around:</P><FORM name=myForm><P><INPUT CHECKED name=type type=radio value=false> Flat scrollbars <INPUT name=type type=radio value=true> 3D scrollbars</P><P><INPUT name=gen type=button value="Generate Source Code"> <INPUT name=copy onclick=copy() type=button value="Copy into Clipboard"></P><P><TEXTAREA cols=85 name=codearea rows=10></TEXTAREA></P></FORM></body><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->