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 相关文章推荐
在chrome浏览器中,防止input[text]和textarea在聚焦时出现黄色边框的解决方法
May 24 Javascript
JavaScript高级程序设计 错误处理与调试学习笔记
Sep 10 Javascript
js完美实现@提到好友特效(兼容各大浏览器)
Mar 16 Javascript
javascript数组去重的方法汇总
Apr 14 Javascript
jQuery实现TAB风格的全国省份城市滑动切换效果代码
Aug 24 Javascript
基于slideout.js实现移动端侧边栏滑动特效
Nov 28 Javascript
Angular4 ElementRef的应用
Feb 26 Javascript
postman自定义函数实现 时间函数的思路详解
Apr 17 Javascript
javascript数组的定义及操作实例
Nov 10 Javascript
vue实现学生信息管理系统
May 30 Javascript
Vue2.x和Vue3.x的双向绑定原理详解
Nov 05 Javascript
JS实现简单的九宫格抽奖
Jun 28 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
PHP array_multisort()函数的使用札记
2011/07/03 PHP
php数组函数序列之prev() - 移动数组内部指针到上一个元素的位置,并返回该元素值
2011/10/31 PHP
ThinkPHP Mobile使用方法简明教程
2014/06/18 PHP
浅析THINKPHP的addAll支持的最大数据量
2015/02/03 PHP
javascript new fun的执行过程
2010/08/05 Javascript
jQuery EasyUI API 中文文档 - DataGrid数据表格
2011/11/17 Javascript
JavaScript使用indexOf获得子字符串在字符串中位置的方法
2015/04/06 Javascript
js判断上传文件后缀名是否合法
2016/01/28 Javascript
javascript表单事件处理方法详解
2016/05/15 Javascript
js两种拼接字符串的简单方法(必看)
2016/09/02 Javascript
利用jQuery实现打字机字幕效果实例代码
2016/09/02 Javascript
jQuery Ztree行政地区树状展示(点击加载)
2016/11/09 Javascript
Bootstrap缩略图的创建方法
2017/03/22 Javascript
原生JavaScript来实现对dom元素class的操作方法(推荐)
2017/08/16 Javascript
详解Nodejs 通过 fs.createWriteStream 保存文件
2017/10/10 NodeJs
node+koa2+mysql+bootstrap搭建一个前端论坛
2018/05/06 Javascript
js实现左右两侧浮动广告
2018/07/09 Javascript
微信小程序实现按字母排列选择城市功能
2019/11/25 Javascript
[47:04]LGD vs infamous Supermajor小组赛D组 BO3 第二场 6.3
2018/06/04 DOTA
python基于socket实现网络广播的方法
2015/04/29 Python
解决python3 pika之连接断开的问题
2018/12/18 Python
python树莓派红外反射传感器
2019/01/21 Python
python将四元数变换为旋转矩阵的实例
2019/12/04 Python
使用HTML5和CSS3表单验证功能
2017/05/05 HTML / CSS
意大利文具和办公产品在线商店:Y-Office
2020/02/27 全球购物
土木建筑学生自我评价
2014/01/14 职场文书
人事文员岗位职责
2014/02/16 职场文书
社区平安建设方案
2014/05/25 职场文书
镇班子对照检查材料思想汇报
2014/09/24 职场文书
教师拔河比赛广播稿
2014/10/14 职场文书
三好学生事迹材料
2014/12/24 职场文书
店长岗位职责
2015/02/11 职场文书
求职简历自我评价怎么写
2015/03/10 职场文书
电子商务专业求职信范文
2015/03/19 职场文书
教你使用vscode 搭建react-native开发环境
2021/07/07 Javascript
面试提问mysql一张表到底能存多少数据
2022/03/13 MySQL