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

这是截图:

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

 <SCRIPT LANGUAGE="JavaScript">
 <!-- Begin

 var i=0, bg=0, bgI=1, cNum=1;

 var cArray = new Array(4);

 var hex = new Array(30);

 cArray[0]="FF0000";

 cArray[1]="FFFFFF";

 cArray[2]="0000FF";

 cArray[3]="FF0000";

 cArray[4]="FFFFFF";

 hex[0]="00";

 hex[1]="09";

 hex[2]="11";

 hex[3]="1A";

 hex[4]="22";

 hex[5]="2B";

 hex[6]="33";

 hex[7]="3C";

 hex[8]="44";

 hex[9]="4D";

 hex[10]="55";

 hex[11]="5E";

 hex[12]="66";

 hex[13]="6F";

 hex[14]="77";

 hex[15]="80";

 hex[16]="88";

 hex[17]="91";

 hex[18]="99";

 hex[19]="A2";

 hex[20]="AA";

 hex[21]="B3";

 hex[22]="BB";

 hex[23]="C4";

 hex[24]="CC";

 hex[25]="D5";

 hex[26]="DD";

 hex[27]="E6";

 hex[28]="EE";

 hex[29]="F7";

 hex[30]="FF";

 function BgFade() {

      if (cNum==1) {FadeRed();}

      else if (cNum==2) {FadeWhite();}

      else {FadeBlue();}

 }

 function FadeRed() {

      bg+=bgI;

      if (bg>29) {bgI=-1;}

      else if (bg<1) {bgI=-1;cNum=2;}

      document.body.bgColor="#"+hex[bg]+"0000";

 }

 function FadeWhite() {

      bg+=bgI;

      if (bg>29) {bgI=-1;}

      else if (bg<1) {bgI=-1;cNum=3;}

      document.body.bgColor="#"+hex[bg]+hex[bg]+hex[bg];

 }

 function FadeBlue() {

      bg+=bgI;

      if (bg>29) {bgI=-1;}

      else if (bg<1) {bgI=-1;cNum=1;}

      document.body.bgColor="#0000"+hex[bg];

 }

 //  End -->

 </script>

JavaScript实例技巧精选(14)—动态变化背景颜色的更多相关文章

  1. JavaScript实例技巧精选(10)—计算器实例2

    >>点击这里下载完整html源码<< 这是截图: 利用Javascript和html实现的另一个计算器实例,核心代码如下: <script language=" ...

  2. JavaScript实例技巧精选(9)—计算器实例1

    >>点击这里下载完整html源码<< 这是截图: 利用Javascript和html实现的一个计算器实例,核心代码如下: <script language="J ...

  3. Javascript实例技巧精选(7)—设置和获取文本框与文本域的光标位置(兼容IE和Chrome,Firefox)

    >>点击这里下载完整html源码<< 截图如下: 本实例描述了如何用Javascript来控制和获取文本框/文本域的鼠标光标位置,以下代码兼容IE和Chrome,Firefox ...

  4. JavaScript实例技巧精选(13)—计算在网页上的停留时间

    >>点击这里下载完整html源码<< 这是截图: 核心代码如下: <SCRIPT LANGUAGE="JAVASCRIPT"> <!-- ...

  5. JavaScript实例技巧精选(12)—计算星座与属相

    >>点击这里下载完整html源码<< 这是截图: 核心代码如下: <SCRIPT LANGUAGE="JavaScript"> <!-- ...

  6. Javascript实例技巧精选(8)—计算当月剩余天数

    >>点击这里下载完整html源码<< 截图如下: 利用Javascript在网页上计算当前月份的剩余天数,相应代码如下: <script language="J ...

  7. Javascript实例技巧精选(6)—滚动鼠标中键读取Json数据分页显示网页内容

    >>点击这里下载完整html源码<< 截图如下: 滚动鼠标中键读取Json数据分页显示网页内容,关键的Javascript如下: <script type="t ...

  8. JavaScript实例技巧精选(11)—计算器实例3

    >>点击这里下载完整html源码<< 界面如下 将以下代码插入<body></body>中 <FORM NAME="Calc" ...

  9. CSS 之动态变换背景颜色

    先上效果图 HTML代码: 123456789 <div class="header"> <h1>GCCHRN'S BLOG</h1> < ...

随机推荐

  1. jquery初步总结

    1.$(document).ready()方法和window.onload差分法 为页元件的正确操作,我们需要把操作元件JS编写的代码$(document).ready()(Jquery)或windo ...

  2. 使用Team Foundation Server 2012源代码管理基本

    原文:使用Team Foundation Server 2012源代码管理基本 本篇体验Team Foundation Server 2012安装及源代码管理.   □ 安装 搜索"team ...

  3. 用C#绘图实现动画出现卡屏(运行慢)问题的解决办法

    原文:用C#绘图实现动画出现卡屏(运行慢)问题的解决办法 正在用C#做一个小游戏,需要用到动画,上次解决的问题是闪烁问题,用双缓冲技术.以为不会有什么问题了.后来当把图片全部绘制上去的时候依然出现了卡 ...

  4. PL/SQL程序中调用Java代码(转)

    主要是学习PL/SQL调用JAVA的方法. 平台:WINDOWS 1.首先使用IDE写好需要调用的java代码,再添加"create or replace and compile java ...

  5. 【Python】Python的urllib模、urllib2模块的网络下载文件

    因为需要从一些下载一个页PDF文件.但是需要下载PDF有数百个文件,这是不可能用人工点击下载.只是Python有相关模块,所以写一个程序PDF文件下载,顺便熟悉Python的urllib模块和ulrl ...

  6. 怎样将short[]数组转换成byte[]数组

    byte[] byteArray = Array.ConvertAll<short, byte>(shortArray, Convert.ToByte);

  7. Web前端开发实用的Chrome插件

    Web前端开发实用的Chrome插件 越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率.尤其Chrome本身是可以登录的,登录 ...

  8. XSS Overview

    什么是XSS? 跨站脚本攻击(Cross Site Scripting):攻击者往Web页面里插入恶意脚本,当用户浏览该页面时,嵌入页面的脚本代码会被执行,从而达到恶意攻击用户的特殊目的.恶意的内容通 ...

  9. C语言qsort函数算法性能测试

    对于该算法的复杂性.一个直接的方法是测量的一定量的算法级数据的执行时间的感知. 随着C语言提供qsort对于示例.随着100一万次的数据,以测试其计算量.感知O(nlg(n))时间成本: C码如下面: ...

  10. 互联网创业应该如何找到创意 - RethinkDB创始人Slava Akhmechet的几点建议

    关于作者 我叫Slava Akhmechet,本人是 RethinkDB 的创始人之一,RethinkDB是一个设计来帮助开发者和运营团队来处理无结构数据的一个开源的分布式数据库,用户可以使用它来作为 ...