编程 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 相关文章推荐

jqGrid jQuery 表格插件测试代码

Aug 23 Javascript

Javascript的数组与字典用法与遍历对象的属性技巧

Nov 07 Javascript

jquery实现无限分级横向导航菜单的方法

Mar 12 Javascript

JQuery实现Ajax加载图片的方法

Dec 24 Javascript

javascript的几种继承方法介绍

Mar 22 Javascript

JS敏感词过滤代码

Dec 23 Javascript

jQuery编写设置和获取颜色的插件

Jan 09 Javascript

TableSort.js表格排序插件使用方法详解

Feb 10 Javascript

关于vue面试题汇总

Mar 20 Javascript

layui 解决form表单点击无反应的问题

Oct 25 Javascript

js实现无缝轮播图

Mar 09 Javascript

vue3使用vue-router的完整步骤记录

Jun 20 Vue.js

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

PHP 类型转换函数intval

2009/06/20 PHP

php基于双向循环队列实现历史记录的前进后退等功能

2015/08/08 PHP

最新制作ThinkPHP3.2.3完全开发手册

2015/11/23 PHP

PHP从零开始打造自己的MVC框架之类的自动加载实现方法详解

2019/06/03 PHP

百度 popup.js 完美修正版非常的不错脚本之家推荐

2009/04/17 Javascript

判断脚本加载是否完成的方法

2009/05/26 Javascript

纯js实现背景图片切换效果代码

2010/11/14 Javascript

jquery json 实例代码

2010/12/02 Javascript

jQuery+ajax简单实现文件上传的方法

2016/06/03 Javascript

js实现select选择框效果及美化

2016/08/19 Javascript

扩展Bootstrap Tooltip插件使其可交互的方法

2016/11/07 Javascript

JavaScript常见的五种数组去重的方式

2016/12/15 Javascript

jQuery选择器之子元素选择器详解

2017/09/18 jQuery

实现div滚动条默认最底部以及默认最右边的示例代码

2017/11/15 Javascript

详解ECMAScript typeof用法

2018/07/25 Javascript

Python中的filter()函数的用法

2015/04/27 Python

python实现kNN算法

2017/12/20 Python

Python调用C++,通过Pybind11制作Python接口

2018/10/16 Python

对Python 检查文件名是否规范的实例详解

2019/06/10 Python

Python3 批量扫描端口的例子

2019/07/25 Python

python 将dicom图片转换成jpg图片的实例

2020/01/13 Python

windows支持哪个版本的python

2020/07/03 Python

Django def clean()函数对表单中的数据进行验证操作

2020/07/09 Python

Python confluent kafka客户端配置kerberos认证流程详解

2020/10/12 Python

pycharm 的Structure界面设置操作

2021/02/05 Python

使用CSS3来代替JS实现交互

2017/08/10 HTML / CSS

Antler英国官网：购买安特丽行李箱、拉杆箱

2019/08/25 全球购物

机械制造专业个人的自我评价

2013/12/28 职场文书

关于学习的演讲稿

2014/05/10 职场文书

城管执法人员纪律作风整顿思想汇报

2014/09/13 职场文书

2015年感恩节演讲稿（优选篇）

2015/03/20 职场文书

男人帮观后感

2015/06/18 职场文书

请学会珍惜眼前，因为人生没有下辈子！

2019/11/12 职场文书

quickjs 封装 JavaScript 沙箱详情

2021/11/02 Javascript

vue封装数字翻牌器

2022/04/20 Vue.js

Python内置类型集合set和frozenset的使用详解

2022/04/26 Python