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

JavaScript Event学习第七章事件属性

Feb 07 Javascript

setTimeout和setInterval的区别你真的了解吗?

Mar 31 Javascript

字符串的replace方法应用浅析

Dec 06 Javascript

jQuery实现右下角可缩放大小的层完整实例

Jun 20 Javascript

实现JavaScript高性能的数据存储

Dec 11 Javascript

jQuery焦点图轮播效果实现方法

Dec 19 Javascript

javascript 中null和undefined区分和比较

Apr 19 Javascript

Vue.directive 自定义指令的问题小结

Mar 04 Javascript

总结JavaScript在IE9之前版本中内存泄露问题

Apr 28 Javascript

学习使用ExpressJS 4.0中的新Router的用法

Nov 06 Javascript

vue 中使用print.js导出pdf操作

Nov 13 Javascript

vue 根据选择的月份动态展示日期对应的星期几

Feb 06 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初学者们头痛的十四个问题

2007/01/15 PHP

PHP 危险函数解释分析

2009/04/22 PHP

thinkphp3.0 模板中函数的使用

2012/11/13 PHP

php运行报错Call to undefined function curl_init()的最新解决方法

2016/11/20 PHP

实例讲解php实现多线程

2019/01/27 PHP

HTML 自动伸缩的表格Table js实现

2009/04/01 Javascript

原创javascript小游戏实现代码

2010/08/19 Javascript

javascript面向对象入门基础详细介绍

2012/09/05 Javascript

深入理解JavaScript是如何实现继承的

2013/12/12 Javascript

上传图片js判断图片尺寸和格式兼容IE

2014/09/01 Javascript

跟我学习javascript创建对象(类)的8种方法

2015/11/20 Javascript

jQuery简单注册和禁用全局事件的方法

2016/07/25 Javascript

详解JavaScript跨域总结与解决办法

2016/10/31 Javascript

推荐VSCode 上特别好用的 Vue 插件之vetur

2017/09/14 Javascript

vue路由跳转时判断用户是否登录功能的实现

2017/10/26 Javascript

js 公式编辑器 - 自定义匹配规则 - 带提示下拉框 - 动态获取光标像素坐标

2018/01/04 Javascript

150行Node.js实现的dns代理工具

2019/08/02 Javascript

Vue 实现把表单form数据转化成json格式的数据

2019/10/29 Javascript

使用 UniApp 实现小程序的微信登录功能

2020/06/09 Javascript

[52:12]FNATIC vs Infamous 2019国际邀请赛小组赛 BO2 第一场 8.16

2019/08/19 DOTA

python调用shell的方法

2013/11/20 Python

python的keyword模块用法实例分析

2015/06/30 Python

python安装Scrapy图文教程

2017/08/14 Python

pygame实现简易飞机大战

2018/09/11 Python

浅谈Pycharm调用同级目录下的py脚本bug

2018/12/03 Python

PyQt5的安装配置过程,将ui文件转为py文件后显示窗口的实例

2019/06/19 Python

Python自动生成代码使用tkinter图形化操作并生成代码框架

2019/09/18 Python

在Python中等距取出一个数组其中n个数的实现方式

2019/11/27 Python

Python3 main函数使用sys.argv传入多个参数的实现

2019/12/25 Python

Linux文件操作命令都有哪些

2016/07/23 面试题

室内设计实习自我鉴定

2013/09/25 职场文书

思想专业自荐信范文

2013/12/25 职场文书

工作会议主持词

2014/03/17 职场文书

《飘》英文读后感五篇

2019/10/11 职场文书

【海涛教你打DOTA】黑鸟第一视角解说

2022/04/01 DOTA

Java Spring Boot 正确读取配置文件中的属性的值

2022/04/20 Java/Android