JavaScript实现表格快速变色效果代码


Posted in Javascript onAugust 19, 2015

本文实例讲述了JavaScript实现表格快速变色效果的方法。分享给大家供大家参考。具体如下:

这里使用JavaScript实现一个极酷的表格特效,表格快速的变色,形成色彩炫丽的效果,第一眼看上去,甚至不像是表格。读者可以通过本代码来研究一下Js的相关特性,了解一些JS编程技巧。

运行效果截图如下:

JavaScript实现表格快速变色效果代码

在线演示地址如下:

具体代码如下:

<HTML>
<HEAD>
<TITLE>变色表格</TITLE>
<META content="text/html; charset=utf-8" http-equiv=Content-Type>
</HEAD>
<body>
<script>
l=Array(0,1,2,3,4,5,6,7,8,9,'a','b','b','c','d','e','f');
function f(y)
{
 for(i=5;i<117;i++)
 {
 c=(i+y)%30;
 if(c>15)
  c=30-c;
 eval("document.all[i].bgColor='00"+l[c]+l[c]+"00'");
 }
 y++;
 setTimeout('f('+y+')','1');
}
function p(x)
{
 document.write("<td> </td>");
 x++;
 if((x%10==1)&&(x%100!=1))
 document.write("</tr><tr>");
 if(x<101)
 p(x);
 else
 {
 document.write("</tr>");
 f(1);
 }
}
document.write("<body bgcolor=0><table width=300 height=300 border=0 cellpadding=0 cellspacing=0><tr>");
p(1);
</script>
</body>
</HTML>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
Iframe自适应高度绝对好使的代码 兼容IE,遨游,火狐
Jan 27 Javascript
dwz 如何去掉ajaxloading具体代码
May 22 Javascript
判断js对象是否拥有某一个属性的js代码
Aug 16 Javascript
JS实现日期加减的方法
Nov 29 Javascript
javascript实现确定和取消提示框效果
Jul 10 Javascript
浅析node应用的timing-attack安全漏洞
Feb 28 Javascript
JavaScript 中的 this 工作原理
Jun 20 Javascript
vue cli4.0项目引入typescript的方法
Jul 17 Javascript
js 函数性能比较方法
Aug 24 Javascript
vue-openlayers实现地图坐标弹框效果
Sep 24 Javascript
js实现随机点名功能
Dec 23 Javascript
小程序实现侧滑删除功能
Jun 25 Javascript
js实现YouKu的漂亮搜索框效果
Aug 19 #Javascript
JS时间特效最常用的三款
Aug 19 #Javascript
js仿黑客帝国字母掉落效果代码分享
Nov 08 #Javascript
JS模拟并美化的表单控件完整实例
Aug 19 #Javascript
js实现文本框只允许输入数字并限制数字大小的方法
Aug 19 #Javascript
Jquery基础教程之DOM操作
Aug 19 #Javascript
jquery小火箭返回顶部代码分享
Aug 19 #Javascript
You might like
php缩放gif和png图透明背景变成黑色的解决方法
2014/10/14 PHP
Yii中表单用法实例详解
2016/01/05 PHP
php+html5+ajax实现上传图片的方法
2016/05/14 PHP
PHP中include/require/include_once/require_once使用心得
2016/08/28 PHP
悄悄用脚本检查你访问过哪些网站的代码
2010/12/04 Javascript
说说JSON和JSONP 也许你会豁然开朗
2012/09/02 Javascript
Javascript中引用示例介绍
2014/02/21 Javascript
JavaScript中实现PHP的打乱数组函数shuffle实例
2014/10/11 Javascript
jquery常用方法及使用示例汇总
2014/11/08 Javascript
JavaScript实现基于Cookie的存储类实例
2015/04/10 Javascript
Bootstrap每天必学之按钮(Button)插件
2016/04/25 Javascript
vue使用keep-alive实现数据缓存不刷新
2017/10/21 Javascript
在vue项目中使用sass的配置方法
2018/03/20 Javascript
记React connect的几种写法(小结)
2018/09/18 Javascript
微信小程序开发的基本流程步骤
2019/01/31 Javascript
python正则表达式去掉数字中的逗号(python正则匹配逗号)
2013/12/25 Python
Python列表生成器的循环技巧分享
2015/03/06 Python
十个Python程序员易犯的错误
2015/12/15 Python
Python实现的中国剩余定理算法示例
2017/08/05 Python
Python登录并获取CSDN博客所有文章列表代码实例
2017/12/28 Python
python画出三角形外接圆和内切圆的方法
2018/01/25 Python
Python中使用pypdf2合并、分割、加密pdf文件的代码详解
2019/05/21 Python
python并发编程多进程 模拟抢票实现过程
2019/08/20 Python
python实现信号时域统计特征提取代码
2020/02/26 Python
django使用F方法更新一个对象多个对象字段的实现
2020/03/28 Python
谈谈python垃圾回收机制
2020/09/27 Python
Python urllib request模块发送请求实现过程解析
2020/12/10 Python
兰蔻俄罗斯官方网站:Lancome俄罗斯
2019/12/09 全球购物
九年级历史教学反思
2014/01/27 职场文书
初中同学聚会感言
2014/02/11 职场文书
庆元旦迎新年广播稿
2014/02/18 职场文书
工程力学专业自荐信范文
2014/03/17 职场文书
员工入职担保书范文
2014/04/01 职场文书
安全目标管理责任书
2014/07/25 职场文书
2014年个人委托书范本
2014/10/13 职场文书
MySQL窗口函数的具体使用
2021/11/17 MySQL