>>点击这里下载完整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. 客房收费系统改造(三)—厂+反射+DAL

    前一段时间有一个简单的三登录功能实现窗口,心灵修养一点点,但很快就被泼了一盆冷水.房费是不可能做到在短短三年,假设你使用三个,这倒房费三个功能必须使用函数来实现.了七层的研究. 经过一个星期的看博客. ...

  2. 在sd卡,创建目录和文件

    在本文中,sd卡的情况下创建的文件和目录,介绍如何创建目录和文件的重点. 1. 路径问题(以下的样例是在Java中測试的,在Android中相同适用) 1.1 假设须要在目录中创建文件的目录存在,直接 ...

  3. 考试easy该,学习如何做?

    我的两个学生(场和任)都讲了他们周末參加的一个认证考试不考大题考小题的事情.由感而发: 话说不用大题考,大概是不敢用大题考. 老师的教.和学生的学中.存在的一些问题得不到解决,整体讲,学生的学习效果没 ...

  4. 十天学Linux内核之第九天---向内核添加代码

    原文:十天学Linux内核之第九天---向内核添加代码 睡了个好觉,很晚才起,好久没有这么舒服过了,今天的任务不重,所以压力不大,呵呵,现在的天气真的好冷,不过实验室有空调,我还是喜欢待在这里,有一种 ...

  5. JMeter模拟多个用户进行登录

    1.将用户名密码保存在cvs或txt文件中格式为 username1,password1 username2,password2 username3,password4 一行一个,用户名和密码之间使用 ...

  6. mac 配置Python集成开发环境

    mac 配置Python集成开发环境(Eclipse +Python+Pydev) 1.下载Mac版64位的Eclipse. 进入到Eclipse官方网站的下载页面(http://www.eclips ...

  7. 数组排序、递归——(Java学习笔记二)

    升序:      选择排序:         选定一个元素,一次和后面的元素相比较,如果选定的元素大雨后面的比较元素,就交换位置         先出现最小值,最后出现最大值. public stat ...

  8. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(4)-业务逻辑层的封装

    原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(4)-业务逻辑层的封装 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    (2) ...

  9. bigdata_一篇文看懂Hadoop

    本文转载:暂未找到原出处,如需署名 请联系 我们很荣幸能够见证Hadoop十年从无到有,再到称王.感动于技术的日新月异时,希望通过这篇内容深入解读Hadoop的昨天.今天和明天,憧憬下一个十年. 本文 ...

  10. SQL字符串转换为数组

    /*一.按指定符号分割字符串,返回分割后的元素个数,方法很简单,就是看字符串中存在多少个分隔符号,然后再加一,就是要求的结果. -----rtrim(@str)去掉 @str右边的字符 ltrim(@ ...