JavaScript实例技巧精选(14)—动态变化背景颜色

>>点击这里下载完整html源码<<

这是截图:

网页背景颜色随时间变化，核心代码如下：

  1 <SCRIPT LANGUAGE="JavaScript">
  2 <!-- Begin
  3 
  4 var i=0, bg=0, bgI=1, cNum=1;
  5 
  6 var cArray = new Array(4);
  7 
  8 var hex = new Array(30);
  9 
 10 cArray[0]="FF0000";
 11 
 12 cArray[1]="FFFFFF";
 13 
 14 cArray[2]="0000FF";
 15 
 16 cArray[3]="FF0000";
 17 
 18 cArray[4]="FFFFFF";
 19 
 20 hex[0]="00";
 21 
 22 hex[1]="09";
 23 
 24 hex[2]="11";
 25 
 26 hex[3]="1A";
 27 
 28 hex[4]="22";
 29 
 30 hex[5]="2B";
 31 
 32 hex[6]="33";
 33 
 34 hex[7]="3C";
 35 
 36 hex[8]="44";
 37 
 38 hex[9]="4D";
 39 
 40 hex[10]="55";
 41 
 42 hex[11]="5E";
 43 
 44 hex[12]="66";
 45 
 46 hex[13]="6F";
 47 
 48 hex[14]="77";
 49 
 50 hex[15]="80";
 51 
 52 hex[16]="88";
 53 
 54 hex[17]="91";
 55 
 56 hex[18]="99";
 57 
 58 hex[19]="A2";
 59 
 60 hex[20]="AA";
 61 
 62 hex[21]="B3";
 63 
 64 hex[22]="BB";
 65 
 66 hex[23]="C4";
 67 
 68 hex[24]="CC";
 69 
 70 hex[25]="D5";
 71 
 72 hex[26]="DD";
 73 
 74 hex[27]="E6";
 75 
 76 hex[28]="EE";
 77 
 78 hex[29]="F7";
 79 
 80 hex[30]="FF";
 81 
 82 
 83 
 84 function BgFade() {
 85 
 86      if (cNum==1) {FadeRed();}
 87 
 88      else if (cNum==2) {FadeWhite();}
 89 
 90      else {FadeBlue();}
 91 
 92 }
 93 
 94 
 95 
 96 function FadeRed() {
 97 
 98      bg+=bgI;
 99 
100      if (bg>29) {bgI=-1;}
101 
102      else if (bg<1) {bgI=-1;cNum=2;}
103 
104      document.body.bgColor="#"+hex[bg]+"0000";
105 
106 }
107 
108 
109 
110 function FadeWhite() {
111 
112      bg+=bgI;
113 
114      if (bg>29) {bgI=-1;}
115 
116      else if (bg<1) {bgI=-1;cNum=3;}
117 
118      document.body.bgColor="#"+hex[bg]+hex[bg]+hex[bg];
119 
120 }
121 
122 
123 
124 function FadeBlue() {
125 
126      bg+=bgI;
127 
128      if (bg>29) {bgI=-1;}
129 
130      else if (bg<1) {bgI=-1;cNum=1;}
131 
132      document.body.bgColor="#0000"+hex[bg];
133 
134 }
135 
136 //  End -->
137 
138 </script>