编程 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实现点击同时更改两个iframe的网址

Jul 01 Javascript

两种方法基于jQuery实现IE浏览器兼容placeholder效果

Oct 14 Javascript

jQuery中的pushStack实现原理和应用实例

Feb 03 Javascript

JS简单设置下拉选择框默认值的方法

Aug 20 Javascript

微信开发消息推送实现代码

Oct 21 Javascript

详解Vue2.X的路由管理记录之钩子函数（切割流水线）

May 02 Javascript

jQuery回调方法使用示例

Jun 26 jQuery

JavaScript之map reduce_动力节点Java学院整理

Jun 29 Javascript

利用ES6实现单例模式及其应用详解

Dec 09 Javascript

vue移动端实现红包雨效果

Jun 23 Javascript

vue2.0 中使用transition实现动画效果使用心得

Aug 13 Javascript

原生Vue 实现右键菜单组件功能

Dec 16 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

PHP写日志的实现方法

2014/11/05 PHP

深入理解Yii2.0乐观锁与悲观锁的原理与使用

2017/07/26 PHP

nodejs 后缀名判断限制代码

2011/03/31 NodeJs

解决JQeury显示内容没有边距内容紧挨着浏览器边线

2013/12/20 Javascript

jQuery中:empty选择器用法实例

2014/12/30 Javascript

jquery实现简单的轮换出现效果实例

2015/07/23 Javascript

jquery图片滚动放大代码分享（1）

2015/08/25 Javascript

第二篇Bootstrap起步

2016/06/21 Javascript

提高JavaScript执行效率的23个实用技巧

2017/03/01 Javascript

[js高手之路]图解javascript的原型(prototype)对象,原型链实例

2017/08/28 Javascript

解决axios发送post请求返回400状态码的问题

2018/08/11 Javascript

js 实现ajax发送步骤过程详解

2019/07/25 Javascript

在vue中使用echars实现上浮与下钻效果

2019/11/08 Javascript

详解Vue+elementUI build打包部署后字体图标丢失问题

2020/07/13 Javascript

layui使用及简单的三级联动实现教程

2020/12/01 Javascript

[59:53]DOTA2-DPC中国联赛正赛 VG vs Elephant BO3 第二场 3月6日

2021/03/11 DOTA

python映射列表实例分析

2015/01/26 Python

使用Python脚本在Linux下实现部分Bash Shell的教程

2015/04/17 Python

用Python给文本创立向量空间模型的教程

2015/04/23 Python

Python实现完整的事务操作示例

2017/06/20 Python

python实现识别手写数字 python图像识别算法

2020/03/23 Python

pygame实现贪吃蛇游戏（下）

2019/10/29 Python

python3 正则表达式基础廖雪峰

2020/03/25 Python

德国婴儿推车和儿童安全座椅商店：BABYSHOP

2016/09/01 全球购物

日本最大的旅游网站：Rakuten Travel（乐天旅游）

2018/08/02 全球购物

屈臣氏官方旗舰店：亚洲享负盛名的保健及美妆零售商

2019/03/15 全球购物

空指针到底是什么

2012/08/07 面试题

桥梁与隧道工程专业本科生求职信

2013/10/08 职场文书

门卫人员岗位职责

2013/12/24 职场文书

工会主席岗位责任制

2014/02/11 职场文书

银行转正自我鉴定

2014/09/29 职场文书

普通党员个人剖析材料

2014/10/08 职场文书

公司离职证明范本

2014/10/17 职场文书

手术室护士个人总结

2015/02/13 职场文书

2016秋季校长开学典礼致辞

2015/11/26 职场文书

浅谈：电影《孔子》观后感（范文）

2019/10/14 职场文书