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 相关文章推荐
jQuery getJSON 处理json数据的代码
Jul 26 Javascript
jQuery 过滤not()与filter()实例代码
May 10 Javascript
解析js原生方法创建表格效率测试
Jul 08 Javascript
js输入框邮箱自动提示功能代码实现
Dec 10 Javascript
JS实现自适应高度表单文本框的方法
Feb 25 Javascript
js检测离开或刷新页面时表单数据是否更改的方法
Aug 02 Javascript
Vuex和前端缓存的整合策略详解
May 09 Javascript
详解Vue中状态管理Vuex
May 11 Javascript
jquery append与appendTo方法比较
May 24 jQuery
Vue2.0实现组件数据的双向绑定问题
Mar 06 Javascript
生产制造追溯系统之在线打印功能
Jun 03 Javascript
微信内置浏览器图片查看器的代码实例
Oct 08 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 iconv 函数转gb2312的bug解决方法
2009/10/11 PHP
理解和运用PHP中的多态性[译]
2011/08/02 PHP
PHP的SQL注入过程分析
2012/01/06 PHP
PHP抽奖算法程序代码分享
2015/10/08 PHP
Yii2如何批量添加数据
2016/05/17 PHP
Laravel5.1 框架响应基本用法实例分析
2020/01/04 PHP
Extjs学习笔记之六 面版
2010/01/08 Javascript
javascript一元操作符(递增、递减)使用示例
2013/08/07 Javascript
AngularJS的表单使用详解
2015/06/17 Javascript
详解Angularjs filter过滤器
2016/02/06 Javascript
Web安全测试之XSS实例讲解
2016/08/15 Javascript
基于Layer+jQuery的自定义弹框
2020/05/26 Javascript
Bootstrap选项卡动态切换效果
2016/11/28 Javascript
jQuery实现QQ空间汉字转拼音功能示例
2017/07/10 jQuery
Vue组件中slot的用法
2018/01/30 Javascript
vue实现配置全局访问路径头(axios)
2019/11/01 Javascript
解决vue项目刷新后,导航菜单高亮显示的位置不对问题
2019/11/01 Javascript
JavaScript(js)处理的HTML事件、键盘事件、鼠标事件简单示例
2019/11/19 Javascript
JavaScript使用百度ECharts插件绘制饼图操作示例
2019/11/26 Javascript
JavaScript实现留言板案例
2020/03/17 Javascript
jquery css实现流程进度条
2020/03/26 jQuery
Python实现各种排序算法的代码示例总结
2015/12/11 Python
基于python plotly交互式图表大全
2019/12/07 Python
python连接PostgreSQL过程解析
2020/02/09 Python
Python字典dict常用方法函数实例
2020/11/09 Python
Canvas获取视频第一帧缩略图的实现
2020/11/11 HTML / CSS
芬兰攀岩、山地运动和户外活动用品购物网站:Bergfreunde
2016/10/06 全球购物
台湾深度自由行旅游平台:Tripbaa趣吧
2017/10/10 全球购物
新西兰最大的品牌运动鞋购物网站:Platypus NZ
2017/10/27 全球购物
EMPHASIS艾斐诗官网:周生生旗下原创精品珠宝品牌
2020/12/17 全球购物
如何进行Linux分区优化
2013/02/12 面试题
医德医魂心得体会
2014/09/11 职场文书
2015年大学团支部工作总结
2015/05/13 职场文书
SQL实现LeetCode(178.分数排行)
2021/08/04 MySQL
关于python3 opencv 图像二值化的问题(cv2.adaptiveThreshold函数)
2022/04/04 Python
Nginx文件已经存在全局反向代理问题排查记录
2022/07/15 Servers