Full version: jsB@nk » Background » Color previwer
URL: https://www.javascriptbank.com/color-previwer.html
This JavaScript allow visitors make the color flashing by clicking the buttons and this JavaScript also display code of these colors.
Full version: jsB@nk » Background » Color previwer
URL: https://www.javascriptbank.com/color-previwer.html
<script language="javascript">/* This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com*/x=0y=65change = new Array(16)change[0]="0"change[1]="1"change[2]="2"change[3]="3"change[4]="4"change[5]="5"change[6]="6"change[7]="7"change[8]="8"change[9]="9"change[10]="A"change[11]="B"change[12]="C"change[13]="D"change[14]="E"change[15]="F"changeback = new Array(106)changeback[0]="00FF00";changeback[1]="11EE00";changeback[2]="22DD00";changeback[3]="33CC00";changeback[4]="44BB00";changeback[5]="55AA00";changeback[6]="669900";changeback[7]="778800";changeback[8]="887700";changeback[9]="996600";changeback[10]="AA5500";changeback[11]="BB4400";changeback[12]="CC3300";changeback[13]="DD2200";changeback[14]="EE1100";changeback[15]="FF0000";changeback[16]="FF1100";changeback[17]="FF2200";changeback[18]="FF3300";changeback[19]="FF4400";changeback[20]="FF5500";changeback[21]="FF6600";changeback[22]="FF7700";changeback[23]="FF8800";changeback[24]="FF9900";changeback[25]="FFAA00";changeback[26]="FFBB00";changeback[27]="FFCC00";changeback[28]="FFDD00";changeback[29]="FFEE00";changeback[30]="FFFF00";changeback[31]="FFEE11";changeback[32]="FFDD22";changeback[33]="FFCC33";changeback[34]="FFBB44";changeback[35]="FFAA55";changeback[36]="FF9966";changeback[37]="FF8877";changeback[38]="FF7788";changeback[39]="FF6699";changeback[40]="FF55AA";changeback[41]="FF44BB";changeback[42]="FF33CC";changeback[43]="FF22DD";changeback[44]="FF11EE";changeback[45]="FF00FF";changeback[46]="EE00FF";changeback[47]="DD00FF";changeback[48]="CC00FF";changeback[49]="BB00FF";changeback[50]="AA00FF";changeback[51]="9900FF";changeback[52]="8800FF";changeback[53]="7700FF";changeback[54]="6600FF";changeback[55]="5500FF";changeback[56]="4400FF";changeback[57]="3300FF";changeback[58]="2200FF";changeback[59]="1100FF";changeback[60]="0000FF";changeback[61]="1111FF";changeback[62]="2222FF";changeback[63]="3333FF";changeback[64]="4444FF";changeback[65]="5555FF";changeback[66]="6666FF";changeback[67]="7777FF";changeback[68]="8888FF";changeback[69]="9999FF";changeback[70]="AAAAFF";changeback[71]="BBBBFF";changeback[72]="CCCCFF";changeback[73]="DDDDFF";changeback[74]="EEEEFF";changeback[75]="FFFFFF";changeback[76]="EEEEEE";changeback[77]="DDDDDD";changeback[78]="CCCCCC";changeback[79]="BBBBBB";changeback[80]="AAAAAA";changeback[81]="999999";changeback[82]="888888";changeback[83]="777777";changeback[84]="666666";changeback[85]="555555";changeback[86]="444444";changeback[87]="333333";changeback[88]="222222";changeback[89]="111111";changeback[90]="000000";changeback[91]="001100";changeback[92]="002200";changeback[93]="003300";changeback[94]="004400";changeback[95]="005500";changeback[96]="006600";changeback[97]="007700";changeback[98]="008800";changeback[99]="009900";changeback[100]="00AA00";changeback[101]="00BB00";changeback[102]="00CC00";changeback[103]="00DD00";changeback[104]="00EE00";changeback[105]="00FF00";function setback(){ x=x+1 document.bgColor="#"+changeback[x] form1.bg.value=changeback[x] if(x==106) {x=0 setback()} else {TimerID=setTimeout("setback()",1)}}function setfront(){ y=y+1 document.fgColor="#"+changeback[y] form1.fg.value=changeback[y] if(y==106) {y=0 setfront()} else {Timer2=setTimeout("setfront()",1)}}function setcols(){ var back=new String() var front=new String() var r1=Math.round(Math.random()*15) var r2=Math.round(Math.random()*15) var r3=Math.round(Math.random()*15) var r4=Math.round(Math.random()*15) var r5=Math.round(Math.random()*15) var r6=Math.round(Math.random()*15) var r7=Math.round(Math.random()*15) var r8=Math.round(Math.random()*15) var r9=Math.round(Math.random()*15) var r10=Math.round(Math.random()*15) var r11=Math.round(Math.random()*15) var r12=Math.round(Math.random()*15) var back="#"+change[r1]+change[r2]+change[r3]+change[r4]+change[r5]+change[r6] var front="#"+change[r7]+change[r8]+change[r9]+change[r10]+change[r11]+change[r12] var back2=change[r1]+change[r2]+change[r3]+change[r4]+change[r5]+change[r6] var front2=change[r7]+change[r8]+change[r9]+change[r10]+change[r11]+change[r12] document.bgColor=back; form1.bg.value=back2; document.fgColor=front; form1.fg.value=front2;}function set(){ document.bgColor="#"+document.form1.bg.value document.fgColor="#"+document.form1.fg.value}function selectedchange(){ for(loop=0;loop<document.form1.bfirst.length;loop++) { if(document.form1.bfirst[loop].selected) {var bg1=change[loop]} } for(loop=0;loop<document.form1.bsecond.length;loop++) { if(document.form1.bsecond[loop].selected) {var bg2=change[loop]} } for(loop=0;loop<document.form1.bthird.length;loop++) { if(document.form1.bthird[loop].selected) {var bg3=change[loop]} } for(loop=0;loop<document.form1.bfourth.length;loop++) { if(document.form1.bfourth[loop].selected) {var bg4=change[loop]} } for(loop=0;loop<document.form1.bfifth.length;loop++) { if(document.form1.bfifth[loop].selected) {var bg5=change[loop]} } for(loop=0;loop<document.form1.bsixth.length;loop++) { if(document.form1.bsixth[loop].selected) {var bg6=change[loop]} } for(loop=0;loop<document.form1.tfirst.length;loop++) { if(document.form1.tfirst[loop].selected) {var fg1=change[loop]} } for(loop=0;loop<document.form1.tsecond.length;loop++) { if(document.form1.tsecond[loop].selected) {var fg2=change[loop]} } for(loop=0;loop<document.form1.tthird.length;loop++) { if(document.form1.tthird[loop].selected) {var fg3=change[loop]} } for(loop=0;loop<document.form1.tfourth.length;loop++) { if(document.form1.tfourth[loop].selected) {var fg4=change[loop]} } for(loop=0;loop<document.form1.tfifth.length;loop++) { if(document.form1.tfifth[loop].selected) {var fg5=change[loop]} } for(loop=0;loop<document.form1.tsixth.length;loop++) { if(document.form1.tsixth[loop].selected) {var fg6=change[loop]} } var back=bg1+bg2+bg3+bg4+bg5+bg6 var front=fg1+fg2+fg3+fg4+fg5+fg6 var backcol="#"+bg1+bg2+bg3+bg4+bg5+bg6 var frontcol="#"+fg1+fg2+fg3+fg4+fg5+fg6 document.bgColor=backcol; document.fgColor=frontcol; document.form1.bg.value=back; document.form1.fg.value=front;}</SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><FORM name=form1><TABLE align=center> <TBODY> <TR> <TD> <TABLE border=10 cellSpacing=10> <TBODY> <TR> <TD> <CENTER><INPUT onclick=setback();setfront() type=button value="Start background colour change"> </CENTER></TD> <TR> <TD> <CENTER><INPUT onclick=clearTimeout(TimerID);clearTimeout(Timer2) type=button value="Stop background colour change"> </CENTER></TD> <TR> <TD> <CENTER><INPUT onclick=setcols() type=button value="Random colour changes"> </CENTER></TD></TR></TBODY></TABLE></TD> <TD> <TABLE border=10 cellSpacing=10> <TBODY> <TR> <TD> <CENTER>Background Colour: </CENTER> <TD> <CENTER>#<INPUT name=bg size="20"> </CENTER></TD> <TR> <TD> <CENTER>Text Colour: </CENTER> <TD> <CENTER>#<INPUT name=fg size="20"> </CENTER></TD> <TR> <TD> <CENTER><INPUT onclick=set() type=button value="Set colours"> </CENTER></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE><P><TABLE align=center border=10 cellSpacing=10> <TBODY> <TR> <TD><INPUT onclick=selectedchange() type=button value="Set colours"> <TD>Select first colour: <TD>Select second colour: <TD>Select third colour: <TD>Select fourth colour: <TD>Select fifth colour: <TD>Select sixth colour: </TD> <TR> <TD>Background: </TD> <TD> <CENTER><SELECT name=bfirst> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD> <TD> <CENTER><SELECT name=bsecond> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD> <TD> <CENTER><SELECT name=bthird> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD> <TD> <CENTER><SELECT name=bfourth> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD> <TD> <CENTER><SELECT name=bfifth> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD> <TD> <CENTER><SELECT name=bsixth> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD></TR> <TR> <TD>Text: </TD> <TD> <CENTER><SELECT name=tfirst> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD> <TD> <CENTER><SELECT name=tsecond> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD> <TD> <CENTER><SELECT name=tthird> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD> <TD> <CENTER><SELECT name=tfourth> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD> <TD> <CENTER><SELECT name=tfifth> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD> <TD> <CENTER><SELECT name=tsixth> <OPTION selected>0<OPTION ="1">1<OPTION ="2">2<OPTION ="3">3<OPTION ="4">4<OPTION ="5">5<OPTION ="6">6<OPTION ="7">7<OPTION ="8">8<OPTION ="9">9<OPTION ="A">A<OPTION ="B">B<OPTION ="C">C<OPTION ="D">D<OPTION ="E">E<OPTION ="F">F</OPTION></SELECT> </CENTER></TD></TR></TBODY></TABLE></FORM><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->