js简单实现调整网页字体大小的方法


Posted in Javascript onJuly 23, 2016

本文实例讲述了js简单实现调整网页字体大小的方法。分享给大家供大家参考,具体如下:

//var tgs = new Array('div','td','tr');
var tgs = new Array('td','tr');
//Specify spectrum of different font sizes:
//var szs = new Array( 'xx-small','x-small','small','medium','large','x-large','xx-large' );
var szs = new Array( '10px','12px','14px','16px','18px','20px','22px' );
var startSz = 2;
function tsize( trgt,inc ) {
  if (!document.getElementById)
  {
    return
  }
  var d = document,cEl = null,sz = startSz,i,j,cTags;
  //sz += inc;
  sz = inc;
  if ( sz < 0 )
  {
    sz = 0;
  }
  if ( sz > 6 )
  {
    sz = 6;
  }
  startSz = sz;
  if ( !( cEl = d.getElementById( trgt ) ) ) cEl = d.getElementsByTagName( trgt )[ 0 ];
  cEl.style.fontSize = szs[ sz ];
  for ( i = 0 ; i < tgs.length ; i++ )
  {
    cTags = cEl.getElementsByTagName( tgs[ i ] );
    for ( j = 0 ; j < cTags.length ; j++ )
    {
      cTags[ j ].style.fontSize = szs[ sz ];
    }
  }
}

使用方法:

<td width="13">
<a href="javascript:tsize('body',0)">
<img src="../image/fsize1of.gif"
name="fsize1" width="18" height="14" border="0" id="fsize1"
onMouseOver="MM_swapImage('fsize1','','../image/fsize1on.gif',1)"
onMouseOut="MM_swapImgRestore()"></a>
</td>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
常用js脚本
Dec 03 Javascript
JS DOM 操作实现代码
Aug 01 Javascript
JavaScript prototype属性深入介绍
Nov 27 Javascript
Jquery显示、隐藏元素以及添加删除样式
Aug 09 Javascript
给html超链接设置事件不使用href来完成跳
Apr 20 Javascript
js去除输入框中所有的空格和禁止输入空格的方法
Jun 09 Javascript
jQuery聚合函数实例
May 21 Javascript
js实现的Easy Tabs选项卡用法实例
Sep 06 Javascript
当jquery ajax遇上401请求的解决方法
May 19 Javascript
require简单实现单页应用程序(SPA)
Jul 12 Javascript
js Canvas实现圆形时钟教程
Sep 19 Javascript
javascript基本常用排序算法解析
Sep 27 Javascript
jquery实现ajax加载超时提示的方法
Jul 23 #Javascript
数据结构中的各种排序方法小结(JS实现)
Jul 23 #Javascript
js的各种排序算法实现(总结)
Jul 23 #Javascript
js事件驱动机制 浏览器兼容处理方法
Jul 23 #Javascript
javaScript事件机制兼容【详细整理】
Jul 23 #Javascript
基于bootstrap实现广告轮播带图片和文字效果
Jul 22 #Javascript
基于Bootstrap实现的下拉菜单手机端不能选择菜单项的原因附解决办法
Jul 22 #Javascript
You might like
德生9700DX电路分析
2021/03/02 无线电
Zend 输出产生XML解析错误
2009/03/03 PHP
phpmyadmin显示utf8_general_ci中文乱码的问题终级篇
2013/04/08 PHP
深入php常用函数的使用汇总
2013/06/08 PHP
CodeIgniter配置之SESSION用法实例分析
2016/01/19 PHP
php Session无效分析资料整理
2016/11/29 PHP
php出租房数据管理及搜索页面
2017/05/23 PHP
JQuery 入门实例1
2009/06/25 Javascript
js 剪切板的用法(clipboardData.setData)与js match函数介绍
2013/11/19 Javascript
每天一篇javascript学习小结(RegExp对象)
2015/11/17 Javascript
jQuery实现ajax调用WCF服务的方法(附带demo下载)
2015/12/04 Javascript
郁闷!ionic中获取ng-model绑定的值为undefined如何解决
2016/08/27 Javascript
JS实现本地存储信息的方法(基于localStorage与userData)
2017/02/18 Javascript
Vue.directive自定义指令的使用详解
2017/03/10 Javascript
浅谈angular4生命周期钩子
2017/09/05 Javascript
vue系列之动态路由详解【原创】
2017/09/10 Javascript
nodejs微信开发之授权登录+获取用户信息
2019/03/17 NodeJs
微信小程序 扭蛋抽奖机css3动画实现详解
2019/07/19 Javascript
[01:09]DOTA2次级职业联赛 - 99战队宣传片
2014/12/01 DOTA
[01:33:30]DOTA2-DPC中国联赛 正赛 RNG vs Phoenix BO3 第二场 2月5日
2021/03/11 DOTA
python BeautifulSoup使用方法详解
2013/11/21 Python
python通过装饰器检查函数参数数据类型的方法
2015/03/13 Python
python快速建立超简单的web服务器的实现方法
2018/02/17 Python
Centos7 Python3下安装scrapy的详细步骤
2018/03/15 Python
python3基于TCP实现CS架构文件传输
2018/07/28 Python
python使用requests模块实现爬取电影天堂最新电影信息
2019/04/03 Python
python将音频进行变速的操作方法
2020/04/08 Python
python 删除excel表格重复行,数据预处理操作
2020/07/06 Python
Parts Express:音频、视频和扬声器的第一来源
2017/04/25 全球购物
阿联酋电子产品购物网站:Menakart
2017/09/15 全球购物
奥林匹亚体育:Olympia Sports
2020/12/30 全球购物
波兰最大的电商平台:Allegro.pl
2021/02/06 全球购物
Java提供了哪些企业应用编程接口
2015/02/13 面试题
揠苗助长教学反思
2014/02/04 职场文书
党员教师四风问题对照检查材料
2014/09/26 职场文书
幽默导游词开场白
2015/05/29 职场文书