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 相关文章推荐
JavaScript的9个陷阱及评点分析
May 16 Javascript
简单的代码实现jquery定时器
Jan 03 Javascript
[原创]Javascript 实现广告后加载 可加载百度谷歌联盟广告
May 11 Javascript
Bootstrap打造一个左侧折叠菜单的系统模板(二)
May 17 Javascript
jQuery图片轮播实现并封装(一)
Dec 03 Javascript
Web 开发中Ajax的Session 超时处理方法
Jan 19 Javascript
Angular.js实现多个checkbox只能选择一个的方法示例
Feb 24 Javascript
深入理解React中何时使用箭头函数
Aug 23 Javascript
原生js实现仿window10系统日历效果的实例
Oct 31 Javascript
微信小程序网络封装(简单高效)
Aug 06 Javascript
jQuery实现侧边栏隐藏与显示的方法详解
Dec 22 jQuery
vue+ESLint 配置保存 自动格式化代码
Mar 17 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获得用户ip地址的比较不错的方法
2014/02/08 PHP
jQuery中append、insertBefore、after与insertAfter的简单用法与注意事项
2020/04/04 Javascript
JQuery页面图片切换和新闻列表滚动效果的具体实现
2013/09/26 Javascript
利用jQuery实现可输入搜索文字的下拉框
2013/10/23 Javascript
浅谈JavaScript事件的属性列表
2015/03/01 Javascript
JS实现当前页居中分页效果的方法
2015/06/18 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
2015/11/17 Javascript
AngularJS使用指令增强标准表单元素功能
2016/07/01 Javascript
jQuery过滤选择器经典应用
2016/08/18 Javascript
JavaScript每天必学之事件
2016/09/18 Javascript
headjs实现网站并行加载但顺序执行JS
2016/11/29 Javascript
layui前段框架日期控件使用方法详解
2017/05/19 Javascript
js学习总结_基于数据类型检测的四种方式(必看)
2017/07/04 Javascript
[01:18]一目了然!DOTA2DotA快捷操作对比第一弹
2014/07/01 DOTA
python 测试实现方法
2008/12/24 Python
用实例说明python的*args和**kwargs用法
2013/11/01 Python
简单谈谈python中的多进程
2016/11/06 Python
python 提取key 为中文的json 串方法
2018/12/31 Python
python+openCV调用摄像头拍摄和处理图片的实现
2019/08/06 Python
解析python实现Lasso回归
2019/09/11 Python
flask框架自定义过滤器示例【markdown文件读取和展示功能】
2019/11/08 Python
Python大数据之使用lxml库解析html网页文件示例
2019/11/16 Python
Python3.7+tkinter实现查询界面功能
2019/12/24 Python
Python实现扫码工具的示例代码
2020/10/09 Python
应届生骨科医生求职信
2013/10/31 职场文书
《陋室铭》教学反思
2014/02/26 职场文书
导航工程专业自荐信
2014/09/02 职场文书
无刑事犯罪记录证明
2014/09/18 职场文书
个人授权委托书范文
2014/09/21 职场文书
法学专业毕业实习自我鉴定2014
2014/09/27 职场文书
2014年最新领导班子整改方案
2014/09/27 职场文书
党员违纪检讨书怎么写
2014/11/01 职场文书
音乐课外活动总结
2015/05/09 职场文书
Python字典的基础操作
2021/11/01 Python
排查并解决MySQL生产库内存使用率高的报警
2022/04/11 MySQL
关于vue-router-link选择样式设置
2022/04/30 Vue.js