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日历功能对象
Jan 12 Javascript
javascript查找字符串中出现最多的字符和次数的小例子
Oct 29 Javascript
jQuery 1.9移除了$.browser可以使用$.support来替代
Sep 03 Javascript
浅谈javascript的分号的使用
May 12 Javascript
JavaScript数据结构与算法之链表
Jan 29 Javascript
JavaScript使ifram跨域相互访问及与PHP通信的实例
Mar 03 Javascript
JavaScript核心语法总结(推荐)
Jun 02 Javascript
详解windows下vue-cli及webpack 构建网站(三)使用组件
Jun 17 Javascript
jfinal与bootstrap的登出实战详解
Nov 27 Javascript
详解如何用typescript开发koa2的二三事
Nov 13 Javascript
JavaScript实现HSL拾色器
May 21 Javascript
JS数组转字符串实现方法解析
Sep 04 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
shopex主机报错误请求解决方案(No such file or directory)
2011/12/27 PHP
浅析PHP原理之变量(Variables inside PHP)
2013/08/09 PHP
php生成EAN_13标准条形码实例
2013/11/13 PHP
phpmyadmin出现Cannot start session without errors问题解决方法
2014/08/14 PHP
php实现的简单日志写入函数
2015/03/31 PHP
浅析Yii2 GridView 日期格式化并实现日期可搜索教程
2016/04/22 PHP
php防止sql注入的方法详解
2017/02/20 PHP
jQuery Select(单选) 模拟插件 V1.3.62 改进版
2010/07/17 Javascript
JavaScript中使用构造函数实现继承的代码
2010/08/12 Javascript
复制小说文本时出现的随机乱码的去除方法
2010/09/07 Javascript
ajax 同步请求和异步请求的差异分析
2011/07/04 Javascript
js动态修改input输入框的type属性(实现方法解析)
2013/11/13 Javascript
js获取会话框prompt的返回值的方法
2015/01/10 Javascript
JS中捕获console.log()输出的方法
2015/04/16 Javascript
JavaScript中数据结构与算法(四):串(BF)
2015/06/19 Javascript
Highcharts学习之坐标轴
2016/08/02 Javascript
javascript中的深复制详解及实例分析
2016/12/29 Javascript
javascript中BOM基础知识总结
2017/02/14 Javascript
Nodejs 获取时间加手机标识的32位标识实现代码
2017/03/07 NodeJs
AngularJS封装$http.post()实例详解
2017/05/06 Javascript
js导出Excel表格超出26位英文字符的解决方法ES6
2017/11/15 Javascript
javascript设计模式 ? 装饰模式原理与应用实例分析
2020/04/14 Javascript
[10:05]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD 选手采访
2021/03/11 DOTA
web.py获取上传文件名的正确方法
2014/08/26 Python
修改Python的pyxmpp2中的主循环使其提高性能
2015/04/24 Python
python定时检查某个进程是否已经关闭的方法
2015/05/20 Python
Python读取MRI并显示为灰度图像实例代码
2018/01/03 Python
Python自定义函数计算给定日期是该年第几天的方法示例
2019/05/30 Python
基于Django统计博客文章阅读量
2019/10/29 Python
Python实现验证码识别
2020/06/15 Python
Python函数递归调用实现原理实例解析
2020/08/11 Python
Html5移动端获奖无缝滚动动画实现示例
2018/06/25 HTML / CSS
J.Crew官网:美国知名休闲服装品牌
2017/05/19 全球购物
大学生学习2014年全国两会心得体会
2014/03/12 职场文书
2014年预备党员学习新党章思想汇报
2014/09/15 职场文书
win10+RTX3050ti+TensorFlow+cudn+cudnn配置深度学习环境的方法
2022/06/25 Servers