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隐藏与显示回到顶部按钮及window.onscroll事件应用
Jan 25 Javascript
下载文件个别浏览器文件名乱码解决办法
Mar 19 Javascript
利用JS判断用户是否上网(连接网络)
Dec 23 Javascript
javaScript对文字按照拼音排序实现代码
Dec 27 Javascript
jQuery1.9.1针对checkbox的调整方法(prop)
May 01 Javascript
javascript中通过arguments参数伪装方法重载
Oct 08 Javascript
基于javascript实现漂亮的页面过渡动画效果附源码下载
Oct 26 Javascript
解决JS无法调用Controller问题的方法
Dec 31 Javascript
JavaScript三种绑定事件方式及相互之间的区别分析
Jan 10 Javascript
更优雅的微信小程序骨架屏实现详解
Aug 07 Javascript
Angular8路由守卫原理和使用方法
Aug 29 Javascript
微信小程序绑定手机号获取验证码功能
Oct 22 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
Windows Server 2008 R2和2012中PHP连接MySQL过慢的解决方法
2016/07/02 PHP
php 自定义函数实现将数据 以excel 表格形式导出示例
2019/11/13 PHP
jQuery.query.js 取参数的两点问题分析
2012/08/06 Javascript
Android中资源文件(非代码部分)的使用概览
2012/12/18 Javascript
Nodejs使用mysql模块之获得更新和删除影响的行数的方法
2014/03/18 NodeJs
jQuery的3种请求方式$.post,$.get,$.getJSON
2014/03/28 Javascript
javascript 控制input只允许输入的各种指定内容
2014/06/19 Javascript
jQuery简单动画变换效果实例分析
2016/07/04 Javascript
jQuery插件dataTables添加序号列的方法
2016/07/06 Javascript
使用JS读取XML文件的方法
2016/11/25 Javascript
js中toString()和String()区别详解
2017/03/23 Javascript
JavaScript使用readAsDataURL读取图像文件
2017/05/10 Javascript
JS中的算法与数据结构之栈(Stack)实例详解
2019/08/20 Javascript
vue实现购物车加减
2020/05/30 Javascript
[01:13]DOTA2群星解读国服召集令 一起说出回归的理由
2013/07/17 DOTA
[01:03:37]Secret vs VGJ.S Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
[02:42]岂曰无衣,与子同袍!DOTA2致敬每一位守护人
2020/02/17 DOTA
Python算法应用实战之队列详解
2017/02/04 Python
Python基于动态规划算法解决01背包问题实例
2017/12/06 Python
python得到windows自启动列表的方法
2018/10/14 Python
python高级特性和高阶函数及使用详解
2018/10/17 Python
浅谈pyqt5中信号与槽的认识
2019/02/17 Python
python的schedule定时任务模块二次封装方法
2019/02/19 Python
Python面向对象程序设计构造函数和析构函数用法分析
2019/04/12 Python
python操作gitlab API过程解析
2019/12/27 Python
Python3爬虫关于代理池的维护详解
2020/07/30 Python
css3动画事件—webkitAnimationEnd与计时器time事件
2013/01/31 HTML / CSS
详解CSS3 filter:drop-shadow滤镜与box-shadow区别与应用
2020/08/24 HTML / CSS
英国汽车和货车租赁网站:Hertz英国
2016/09/02 全球购物
台湾网购生鲜第一品牌:i3Fresh爱上新鲜
2017/10/26 全球购物
软件测试笔试题
2012/10/25 面试题
2016年秋季运动会通讯稿
2015/11/25 职场文书
2016年大学生党员公开承诺书
2016/03/24 职场文书
HTML页面滚动时部分内容位置固定不滚动的实现
2021/04/14 HTML / CSS
golang协程池模拟实现群发邮件功能
2021/05/02 Golang
Python实现天气查询软件
2021/06/07 Python