编程 Javascript

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程序设计有所帮助。

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

- Author -

shichen2014

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

Jquery网页内滑动缓冲导航的实现代码

Apr 05 Javascript

javascript中JSON对象与JSON字符串相互转换实例

Jul 11 Javascript

jquery ztree实现模糊搜索功能

Feb 25 Javascript

IONIC自定义subheader的最佳解决方案

Sep 22 Javascript

AngularJS入门教程之与服务器(Ajax)交互操作示例【附完整demo源码下载】

Nov 02 Javascript

jQuery实现Select下拉列表进行状态选择功能

Mar 30 jQuery

jQuery事件_动力节点Java学院整理

Jul 05 jQuery

jquery自定义显示消息数量

Dec 19 jQuery

微信小程序实现手势图案锁屏功能

Jan 30 Javascript

JS实现带阴历的日历功能详解

Jan 24 Javascript

vue中实现图片压缩 file文件的方法

May 28 Javascript

修改Vue打包后的默认文件名操作

Aug 12 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

苏联队长，苏联超人蝙蝠侠，这些登场的“山寨”英雄真的很严肃

2020/04/09 欧美动漫

用ＰＨＰ和ＡＣＣＥＳＳ写聊天室(三)

2006/10/09 PHP

浅析PHP的静态成员函数效率更高的原因

2014/06/13 PHP

WordPress中获取页面链接和标题的相关PHP函数用法解析

2015/12/17 PHP

PHP设置头信息及取得返回头信息的方法

2016/01/25 PHP

JavaScript toFixed() 方法

2010/04/15 Javascript

Jquery replace 字符替换实现代码

2010/12/02 Javascript

导航跟随滚动条置顶移动示例代码

2013/09/11 Javascript

nodejs中简单实现Javascript Promise机制的实例

2014/12/06 NodeJs

javascript实现rgb颜色转换成16进制格式

2015/07/10 Javascript

jQuery实现自动与手动切换的滚动新闻特效代码分享

2015/08/27 Javascript

适用于手机端的jQuery图片滑块动画

2016/12/09 Javascript

微信小程序实现滑动删除效果

2017/05/19 Javascript

浅谈Vuejs中nextTick()异步更新队列源码解析

2017/12/31 Javascript

js 索引下标之li集合绑定点击事件

2018/01/12 Javascript

Vue多系统切换实现方案

2018/06/05 Javascript

解决vue动态为数据添加新属性遇到的问题

2018/09/18 Javascript

Vue跨域请求问题解决方案过程解析

2020/08/07 Javascript

[01:30]2016国际邀请赛中国区预选赛神秘商店火爆开启

2016/06/26 DOTA

python使用Berkeley DB数据库实例

2014/09/26 Python

Python基于select实现的socket服务器

2016/04/13 Python

举例讲解Python编程中对线程锁的使用

2016/07/12 Python

python3读取csv和xlsx文件的实例

2018/06/22 Python

python 通过类中一个方法获取另一个方法变量的实例

2019/01/22 Python

python3对拉勾数据进行可视化分析的方法详解

2019/04/03 Python

python根据文本生成词云图代码实例

2019/11/15 Python

Windows10下Tensorflow2.0 安装及环境配置教程(图文)

2019/11/21 Python

Python2与Python3的区别详解

2020/02/09 Python

Python迭代器Iterable判断方法解析

2020/03/16 Python

SQL Server 2000数据库的文件有哪些，分别进行描述。

2015/11/09 面试题

大学生应聘自荐信

2013/10/11 职场文书

党的群众路线教育实践活动对照检查材料（教师）

2014/09/24 职场文书

承诺书范本大全

2015/05/04 职场文书

pytorch实现手写数字图片识别

2021/05/20 Python

详解Spring Boot使用系统参数表提升系统的灵活性

2021/06/30 Java/Android

使用HBuilder制作一个简单的HTML5网页

2022/07/07 HTML / CSS