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 相关文章推荐
safari,opera嵌入iframe页面cookie读取问题解决方法
Jun 23 Javascript
jQuery自定义添加&quot;$&quot;与解决&quot;$&quot;冲突的方法
Jan 19 Javascript
jQuery超酷平面式时钟效果代码分享
Mar 30 Javascript
jquery转盘抽奖功能实现
Nov 13 Javascript
jquery及js实现动态加载js文件的方法
Jan 21 Javascript
javascript实现的猜数小游戏完整实例代码
May 10 Javascript
微信小程序实现图片预加载组件
Jan 18 Javascript
详解Angular之constructor和ngOnInit差异及适用场景
Jun 22 Javascript
webpack 4.0.0-beta.0版本新特性介绍
Feb 10 Javascript
JS实现图片轮播效果实例详解【可自动和手动】
Apr 04 Javascript
vue 地图可视化 maptalks 篇实例代码详解
May 21 Javascript
详解Vue3 Teleport 的实践及原理
Dec 02 Vue.js
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新手上路(七)
2006/10/09 PHP
PHP编程中八种常见的文件操作方式
2006/11/19 PHP
解析phpstorm + xdebug 远程断点调试
2013/06/20 PHP
php+mysqli批量查询多张表数据的方法
2015/01/29 PHP
php7 list()、session及其他模块的修改实例分析
2020/05/25 PHP
Mootools 1.2教程 Fx.Tween的使用
2009/09/15 Javascript
JavaScript 输入框内容格式验证代码
2010/02/11 Javascript
JavaScript 浏览器验证代码(来自discuz)
2010/07/17 Javascript
js汉字排序问题 支持中英文混排,兼容各浏览器,包括CHROME
2011/12/20 Javascript
简单谈谈javascript Date类型
2015/09/06 Javascript
js css+html实现简单的日历
2016/07/14 Javascript
JS制作图形验证码实现代码
2020/10/19 Javascript
jQuery实现点击任意位置弹出层外关闭弹出层效果
2016/10/19 Javascript
详解Nodejs的timers模块
2016/12/22 NodeJs
一篇文章搞定JavaScript类型转换(面试常见)
2017/01/21 Javascript
了解重排与重绘
2019/05/29 Javascript
Vue实现背景更换颜色操作
2020/07/17 Javascript
element-ui和vue表单(对话框)验证提示语(残留)清除操作
2020/09/11 Javascript
Python环境下搭建属于自己的pip源的教程
2016/05/05 Python
python用户评论标签匹配的解决方法
2018/05/31 Python
selenium在执行phantomjs的API并获取执行结果的方法
2018/12/17 Python
python启动应用程序和终止应用程序的方法
2019/06/28 Python
python logging模块书写日志以及日志分割详解
2019/07/22 Python
通过Python编写一个简单登录功能过程解析
2019/09/04 Python
amazeui页面分析之登录页面的示例代码
2020/08/25 HTML / CSS
英国景点门票网站:attractiontix
2019/08/27 全球购物
销售冠军获奖感言
2014/02/03 职场文书
教师党员个人整改措施
2014/10/27 职场文书
初中教师个人工作总结
2015/02/10 职场文书
护理工作个人总结
2015/03/03 职场文书
拾金不昧通报表扬范文
2015/05/05 职场文书
关于迟到的检讨书
2015/05/06 职场文书
社会心理学学习心得体会
2016/01/22 职场文书
教师师德承诺书2016
2016/03/25 职场文书
导游词之峨眉山
2019/12/16 职场文书
redis sentinel监控高可用集群实现的配置步骤
2022/04/01 Redis