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 相关文章推荐
DEFER怎么用?
Jul 01 Javascript
Firefox getBoxObjectFor getBoundingClientRect联系
Oct 26 Javascript
预加载css或javascript的js代码
Apr 23 Javascript
javascript字符串拼接的效率问题
Dec 25 Javascript
兼容FF和IE的动态table示例自写
Oct 21 Javascript
jQuery实现仿腾讯视频列表分页效果的方法
Aug 07 Javascript
Javascript实现图片加载从模糊到清晰显示的方法
Jun 21 Javascript
bootstrap使用validate实现简单校验功能
Dec 02 Javascript
vue2配置scss的方法步骤
Jun 06 Javascript
koa2服务端使用jwt进行鉴权及路由权限分发的流程分析
Jul 22 Javascript
微信小程序新闻网站详情页实例代码
Jan 10 Javascript
vue开发移动端底部导航条功能
Apr 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脚本代码
2011/02/19 PHP
谷歌音乐搜索栏的提示功能php修正代码
2011/05/09 PHP
PHP使用NuSOAP调用Web服务的方法
2015/07/18 PHP
php同时使用session和cookie来保存用户登录信息的实现代码
2016/05/13 PHP
Yii2框架数据库简单的增删改查语法小结
2016/08/31 PHP
PHP实现二维数组按照指定的字段进行排序算法示例
2019/04/23 PHP
tp5.1 实现setInc字段自动加1
2019/10/18 PHP
漂亮的仿flash菜单,来自蓝色经典
2006/06/26 Javascript
JavaScript判断两种格式的输入日期的正确性的代码
2007/03/25 Javascript
JavaScript中常用的运算符小结
2012/01/18 Javascript
分享一道笔试题[有n个直线最多可以把一个平面分成多少个部分]
2012/10/12 Javascript
js中的数组Array定义与sort方法使用示例
2013/08/29 Javascript
javascript根据像素点取位置示例
2014/01/27 Javascript
原生JavaScript实现合并多个数组示例
2014/09/21 Javascript
JS实现的鼠标跟随代码(卡通手型点击效果)
2015/10/26 Javascript
jQuery插件ajaxFileUpload使用详解
2017/01/10 Javascript
Vue中如何实现轮播图的示例代码
2017/07/27 Javascript
JS实现数组简单去重及数组根据对象中的元素去重操作示例
2018/01/05 Javascript
php 解压zip压缩包内容到指定目录的实例
2018/01/23 Javascript
详解浏览器缓存和webpack缓存配置
2018/07/06 Javascript
javascript实现支付宝滑块验证码效果
2020/07/24 Javascript
Python中的pass语句使用方法讲解
2015/05/14 Python
Python、 Pycharm、Django安装详细教程(图文)
2019/04/12 Python
Python银行系统实战源码
2019/10/25 Python
谈谈Python:为什么类中的私有属性可以在外部赋值并访问
2020/03/05 Python
美国在线咖啡、茶和餐厅供应商:LollicupStore
2018/05/04 全球购物
中国专业的音频分享平台:喜马拉雅
2019/05/24 全球购物
GafasWorld西班牙:购买太阳镜、眼镜和隐形眼镜
2019/09/08 全球购物
什么是Remote Module
2016/06/10 面试题
jQuery treeview树形结构应用
2021/03/24 jQuery
小学生获奖感言范文
2014/02/02 职场文书
内蒙古鄂尔多斯市市长寄语
2014/04/10 职场文书
小学教师师德师风自我剖析材料
2014/09/29 职场文书
2014年党支部书记工作总结
2014/12/04 职场文书
2016年中秋节晚会领导致辞
2015/11/26 职场文书
Spring boot应用启动后首次访问很慢的解决方案
2021/06/23 Java/Android