用JavaScript实现变色背景和文字
制作变色背景和文字的JavaScript代码有很多种,不过大多数背景颜色变化时有跳跃感,不够柔和。本例的效果特别酷!
请看效果:
背景请用bgcolor参数,前景文字请用fgcolor参数。
全部代码如下:
1、背景:
< html > < head > < title >bgcolor< /title > < meta http-equiv="Content-Type" content="text/html; charset=gb2312" > < script language="JavaScript" > < !-- //you can assign the initial color of the background here r=255; g=50; b=50; flag=0; t=new Array; o=new Array; d=new Array;
function hex(a,c) { t[a]=Math.floor(c/16) o[a]=c%16 switch (t[a]) { case 10: t[a]='A'; break; case 11: t[a]='B'; break; case 12: t[a]='C'; break; case 13: t[a]='D'; break; case 14: t[a]='E'; break; case 15: t[a]='F'; break; default: break; } switch (o[a]) { case 10: o[a]='A'; break; case 11: o[a]='B'; break; case 12: o[a]='C'; break; case 13: o[a]='D'; break; case 14: o[a]='E'; break; case 15: o[a]='F'; break; default: break; } }
function ran(a,c) { if ((Math.random() >2/3||c==0)&&c< 255) { c++ d[a]=2; } else { if ((Math.random()< =1/2||c==255)&&c >0) { c-- d[a]=1; } else d[a]=0; } return c } function do_it(a,c) { if ((d[a]==2&&c< 255)||c==0) { c++ d[a]=2 } else if ((d[a]==1&&c >0)||c==255) { c--; d[a]=1; } if (a==3) { if (d[1]==0&&d[2]==0&&d[3]==0) flag=1 } return c } function disco() { if (flag==0) { r=ran(1, r); g=ran(2, g); b=ran(3, b); hex(1,r) hex(2,g) hex(3,b) document.bgColor="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3] flag=50 } else { r=do_it(1, r) g=do_it(2,g) b=do_it(3,b) hex(1,r) hex(2,g) hex(3,b) document.bgColor="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3] flag-- } if (document.all) setTimeout('disco()',20) } //-- > < /script > < /head >
< body onload="disco()" bgcolor="#FFFFFF" text="#000000" > < /body > < /html > 2、前景文字:
< html > < head > < title >bgcolor< /title > < meta http-equiv="Content-Type" content="text/html; charset=gb2312" > < script language="JavaScript" > < !-- //you can assign the initial color of the background here r=255; g=0; b=0; flag=0; t=new Array; o=new Array; d=new Array; function hex(a,c) { t[a]=Math.floor(c/16) o[a]=c%16 switch (t[a]) { case 10: t[a]='A'; break; case 11: t[a]='B'; break; case 12: t[a]='C'; break; case 13: t[a]='D'; break; case 14: t[a]='E'; break; case 15: t[a]='F'; break; default: break; } switch (o[a]) { case 10: o[a]='A'; break; case 11: o[a]='B'; break; case 12: o[a]='C'; break; case 13: o[a]='D'; break; case 14: o[a]='E'; break; case 15: o[a]='F'; break; default: break; } }
function ran(a,c) { if ((Math.random() >2/3||c==0)&&c< 255) { c++ d[a]=2; } else { if ((Math.random()< =1/2||c==255)&&c >0) { c-- d[a]=1; } else d[a]=0; } return c } function do_it(a,c) { if ((d[a]==2&&c< 255)||c==0) { c++ d[a]=2 } else if ((d[a]==1&&c >0)||c==255) { c--; d[a]=1; } if (a==3) { if (d[1]==0&&d[2]==0&&d[3]==0) flag=1 } return c } function disco() { if (flag==0) { r=ran(1, r); g=ran(2, g); b=ran(3, b); hex(1,r) hex(2,g) hex(3,b) document.fgColor="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3] flag=50 } else { r=do_it(1, r) g=do_it(2,g) b=do_it(3,b) hex(1,r) hex(2,g) hex(3,b) document.fgColor="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3] flag-- } if (document.all) setTimeout('disco()',0) } //-- > < /script > < /head >
< body onload="disco()" text="#000000" style="font:25pt 黑体" >赛迪网电脑应用 < /body > < /html >
|