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

利用404错误页面实现UrlRewrite的实现代码

Aug 20 Javascript

JQuery 学习笔记选择器之六

Jul 23 Javascript

jQuery AnythingSlider滑动效果插件

Feb 07 Javascript

javascript 解决表单仍然提交即使监听处理函数返回false

Mar 14 Javascript

javascript获取网页中指定节点的父节点、子节点的方法小结

Apr 24 Javascript

学习JavaScript鼠标响应事件

Dec 25 Javascript

原生js实现放大镜效果

Jan 11 Javascript

JavaScript实现的鼠标响应颜色渐变效果完整实例

Feb 18 Javascript

微信小程序getPhoneNumber获取用户手机号

Sep 29 Javascript

基于jQuery解决ios10以上版本缩放问题

Nov 03 jQuery

vue.js,ajax渲染页面的实例

Feb 11 Javascript

教你完全理解ReentrantLock重入锁

Jun 03 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下几种删除目录的方法总结

2007/08/19 PHP

微信公众平台接口开发入门示例

2014/12/24 PHP

ThinkPHP 模板substr的截取字符串函数详解

2017/01/09 PHP

PHP封装的page分页类定义与用法完整示例

2018/12/24 PHP

javascript multibox 全选

2009/03/22 Javascript

使用JQUERY Tabs插件宿主IFRAMES

2010/01/01 Javascript

jquery 3D球状导航的文章分类

2010/07/06 Javascript

在多个页面使用同一个HTML片段《续》

2011/03/04 Javascript

JavaScript高级程序设计阅读笔记（六） ECMAScript中的运算符（二）

2012/02/27 Javascript

JQuery魔力之$("tagName")与selector

2012/03/05 Javascript

终于解决了IE8不支持数组的indexOf方法

2013/04/03 Javascript

js 获取和设置css3 属性值的实现方法

2013/05/06 Javascript

JS中判断null、undefined与NaN的方法

2014/03/24 Javascript

JavaScript控制按钮可用或不可用的方法

2015/04/03 Javascript

jquery仿百度百科底部浮动导航特效

2015/08/08 Javascript

简单实现限制uploadify上传个数

2015/11/16 Javascript

JavaScript常用判断写法大全(推荐)

2016/05/30 Javascript

jQuery命名空间与闭包用法示例

2017/01/12 Javascript

原生js轮播特效

2017/05/18 Javascript

详解使用angularjs的ng-options时如何设置默认值(初始值)

2017/07/18 Javascript

Vue项目webpack打包部署到Tomcat刷新报404错误问题的解决方案

2018/05/15 Javascript

JS把字符串格式的时间转换成几秒前、几分钟前、几小时前、几天前等格式

2019/07/10 Javascript

es6中使用map简化复杂条件判断操作实例详解

2020/02/19 Javascript

微信小程序tab左右滑动切换功能的实现代码

2021/02/08 Javascript

[00:36]DOTA2勇士令状莱恩声望物品——冥晶之厄展示

2018/05/25 DOTA

python删除过期文件的方法

2015/05/29 Python

对python pandas读取剪贴板内容的方法详解

2019/01/24 Python

pytest中文文档之编写断言

2019/09/12 Python

Python版中国省市经纬度

2020/02/11 Python

详解Python中namedtuple的使用

2020/04/27 Python

sklearn的predict_proba使用说明

2020/06/28 Python

pycharm专业版远程登录服务器的详细教程

2020/09/15 Python

企业理念标语

2014/06/09 职场文书

甘南现象心得体会

2014/09/11 职场文书

党员个人对照检查材料

2014/10/01 职场文书

MySQL数据库必备之条件查询语句

2021/10/15 MySQL