JS实现网页表格自动变大缩小的方法


Posted in Javascript onMarch 09, 2015

本文实例讲述了JS实现网页表格自动变大缩小的方法。分享给大家供大家参考。具体分析如下:

这就是一个个性的动态表格效果代码,网页中的表格自动放大或者缩小,不停的变化
主要就是一个强调显示的作用

<HTML>

<HEAD>

<TITLE>js会动的表格</TITLE>

<META content="text/html; charset=hz-gb-2312" http-equiv=Content-Type>

<STYLE>.cellstyle {

 COLOR: #ffffff; FONT-FAMILY: Times; FONT-SIZE: 11pt; FONT-WEIGHT: bold

}

A {

 COLOR: #ff0000; TEXT-DECORATION: none

}

A:hover {

 COLOR: #ff8888; TEXT-DECORATION: underline

}

</STYLE>

<SCRIPT language=javaScript>

var i_bordercolor=0

var i_bordercolorlight=10

var i_bordercolordark=20

var v_bordercolor=1

var v_bordercolorlight=1

var v_bordercolordark=1

var textcolor= new Array()

textcolor[0] ="FFFFFF"

textcolor[1] ="FFF8F8"

textcolor[2] ="FFF0F0"

textcolor[3] ="FFD8D8"

textcolor[4] ="FFD0D0"

textcolor[5] ="FFC8C8"

textcolor[6] ="FFC0C0"

textcolor[7] ="FFB8B8"

textcolor[8] ="FFB0B0"

textcolor[9] ="FFA8A8"

textcolor[10] ="FFA0A0"

textcolor[11] ="FF9898"

textcolor[12] ="FF9090"

textcolor[13] ="FF8888"

textcolor[14] ="FF8080"

textcolor[15] ="FF7878"

textcolor[16] ="FF7070"

textcolor[17] ="FF6868"

textcolor[18] ="FF6060"

textcolor[19] ="FF5858"

textcolor[20] ="FF5050"

textcolor[21] ="FF4848"

textcolor[22] ="FF4040"

textcolor[23] ="FF3838"

textcolor[24] ="FF3030"

textcolor[25] ="FF2828"

textcolor[26] ="FF2020"

textcolor[27] ="FF1818"

textcolor[28] ="FF1010"

textcolor[29] ="FF0808"

textcolor[30] ="FF0000"

function checkbrowser() {

    if (document.layers) {

     alert("This script requires Internet Explorer 4 or higher. Sorry folks!")

 }

    if (document.all) {

     bordercolor()

 }

}

function bordercolor() {  

if (i_bordercolor >= textcolor.length-1) {v_bordercolor*=-1}

    if (i_bordercolor <= 0) {v_bordercolor*=-1}

    if (i_bordercolordark >= textcolor.length-1) {v_bordercolordark*=-1}

    if (i_bordercolordark <= 0) {v_bordercolordark*=-1}

    if (i_bordercolorlight >= textcolor.length-1) {v_bordercolorlight*=-1}

    if (i_bordercolorlight <= 0) {v_bordercolorlight*=-1}

    document.all.cellone.borderColor=textcolor[i_bordercolor]

    document.all.cellone.borderColorDark=textcolor[i_bordercolordark]

    document.all.cellone.borderColorLight=textcolor[i_bordercolorlight]

    document.all.cellone.border=i_bordercolorlight*2

    i_bordercolor+=v_bordercolor

    i_bordercolordark+=v_bordercolordark

    i_bordercolorlight+=v_bordercolorlight

    var timer=setTimeout("bordercolor()",100)

}

</SCRIPT>

<META content="Microsoft FrontPage 4.0" name=GENERATOR></HEAD>

<BODY background="" bgColor=#ffffff onload=checkbrowser()>

<P align=center>

<TABLE border=0 cellPadding=6 id=cellone width=540 height="30">

  <TBODY>

  <TR>

    <TD align=middle class=cellstyle height="16">

      <font color="#800000">https://3water.com</font>

      </TR></TBODY>

</TABLE>

</BODY>

</HTML>

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

Javascript 相关文章推荐
用javascript做拖动布局的思路
May 31 Javascript
Dreamweaver jQuery智能提示插件,支持版本提示,支持1.6api
Jul 31 Javascript
JQuery写动态树示例代码
Jul 31 Javascript
javascript中的作用域和上下文使用简要概述
Dec 05 Javascript
JavaScript的Polymer框架中dom-repeat与VM的相关操作
Jul 29 Javascript
JavaScript实现获取远程的html到当前页面中
Mar 26 Javascript
Vue项目中quill-editor带样式编辑器的使用方法
Aug 08 Javascript
用ES6写全屏滚动插件的示例代码
May 02 Javascript
详解基于React.js和Node.js的SSR实现方案
Mar 21 Javascript
node.js使用stream模块实现自定义流示例
Feb 13 Javascript
JS倒计时两种实现方式代码实例
Jul 27 Javascript
bootstrap-closable-tab可实现关闭的tab标签页插件
Aug 09 Javascript
EasyUI中datagrid在ie下reload失败解决方案
Mar 09 #Javascript
JS控制网页动态生成任意行列数表格的方法
Mar 09 #Javascript
jQuery随机密码生成的方法
Mar 09 #Javascript
jQuery实现简单的间隔向上滚动效果
Mar 09 #Javascript
jQuery实现鼠标划过展示大图的方法
Mar 09 #Javascript
javascript 对象数组根据对象object key的值排序
Mar 09 #Javascript
jquery插件corner实现圆角边框的方法
Mar 09 #Javascript
You might like
Protoss兵种介绍
2020/03/14 星际争霸
[转帖]PHP世纪万年历
2006/12/06 PHP
php下统计用户在线时间的一种尝试
2010/08/26 PHP
解析php中die(),exit(),return的区别
2013/06/20 PHP
Windows Server 2008 R2和2012中PHP连接MySQL过慢的解决方法
2016/07/02 PHP
PHP常量DIRECTORY_SEPARATOR原理及用法解析
2020/11/10 PHP
JavaScript面向对象程序设计三 原型模式(上)
2011/12/21 Javascript
浅析JavaScript 调试方法和技巧
2015/10/22 Javascript
JavaScript判断页面加载完之后再执行预定函数的技巧
2016/05/17 Javascript
Javascript 实现简单计算器实例代码
2016/10/23 Javascript
微信小程序-获得用户输入内容
2017/02/13 Javascript
Vue 2.0在IE11中打开项目页面空白的问题解决
2017/07/16 Javascript
Mobile Web开发基础之四--处理手机设备的横竖屏问题
2017/08/11 Javascript
详解通过源码解析Node.js中cluster模块的主要功能实现
2018/05/16 Javascript
layUI实现前端分页和后端分页
2019/07/27 Javascript
解决vue项目中遇到 Cannot find module ‘chalk‘ 报错的问题
2020/11/05 Javascript
javascript实现下拉菜单效果
2021/02/09 Javascript
python线程锁(thread)学习示例
2013/12/04 Python
用Python解决x的n次方问题
2019/02/08 Python
Python使用正则表达式实现爬虫数据抽取
2020/08/17 Python
python 动态渲染 mysql 配置文件的示例
2020/11/20 Python
Python 实现RSA加解密文本文件
2020/12/30 Python
瑜伽国际:Yoga International
2018/04/18 全球购物
俄罗斯在线手表和珠宝商店:AllTime
2019/09/28 全球购物
数百万免费的图形资源:Freepik
2020/09/21 全球购物
Levi’s西班牙官方网站:李维斯,著名的牛仔裤品牌
2020/08/20 全球购物
西北政法大学自主招生自荐信
2014/01/29 职场文书
环保倡议书300字
2014/05/15 职场文书
企业宣传工作方案
2014/06/02 职场文书
工程造价专业求职信
2014/07/17 职场文书
总经理检讨书范文
2015/02/16 职场文书
简历自我评价优缺点
2015/03/11 职场文书
2015年度校学生会工作总结报告
2015/05/23 职场文书
学校安全管理制度
2015/08/06 职场文书
《百分数的认识》教学反思
2016/02/19 职场文书
2016年感恩教师节活动总结
2016/04/01 职场文书