快捷導(dǎo)航

js簡(jiǎn)單實(shí)現(xiàn)調(diào)整網(wǎng)頁(yè)字體大小的方法

更新時(shí)間：2016年07月23日 11:24:34 作者：coder

這篇文章主要介紹了js簡(jiǎn)單實(shí)現(xiàn)調(diào)整網(wǎng)頁(yè)字體大小的方法,通過(guò)javascript動(dòng)態(tài)修改頁(yè)面元素樣式實(shí)現(xiàn)調(diào)整網(wǎng)頁(yè)字體的功能,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下

本文實(shí)例講述了js簡(jiǎn)單實(shí)現(xiàn)調(diào)整網(wǎng)頁(yè)字體大小的方法。分享給大家供大家參考，具體如下：

//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>

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專(zhuān)題：《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript動(dòng)畫(huà)特效與技巧匯總》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

jquery單行文字向上滾動(dòng)效果的實(shí)現(xiàn)代碼
這篇文章主要介紹了jquery單行文字向上滾動(dòng)效果的具體實(shí)現(xiàn)，此效果適應(yīng)于很多場(chǎng)景，會(huì)的不會(huì)的都要學(xué)習(xí)下啊
2014-09-09
老生常談JavaScript面向?qū)ο蠡A(chǔ)與this指向問(wèn)題
下面小編就為大家?guī)?lái)一篇老生常談JavaScript面向?qū)ο蠡A(chǔ)與this指向問(wèn)題。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-10-10
Storage、cookie的用途和優(yōu)缺點(diǎn)比較
cookie的大小是受限制的，并且每次請(qǐng)求cookie都會(huì)被發(fā)送，浪費(fèi)寬帶，cookie還需要指定作用域，不可以跨域調(diào)用。cookie的作用是與服務(wù)器進(jìn)行交互，作為http規(guī)范的一部分存在，而webstorage僅僅是為了本地“存儲(chǔ)”數(shù)據(jù)而生。
2023-07-07
Redux的基本使用過(guò)程步驟詳解
這篇文章主要介紹了Redux的基本使用過(guò)程詳解,本文通過(guò)示例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2022-12-12
JavaScript實(shí)現(xiàn)實(shí)時(shí)更新系統(tǒng)時(shí)間的實(shí)例代碼
本文給大家分享javascript實(shí)現(xiàn)實(shí)時(shí)更新系統(tǒng)時(shí)間的實(shí)例代碼，代碼簡(jiǎn)單易懂，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧
2017-04-04
bootstrap基礎(chǔ)知識(shí)學(xué)習(xí)筆記
這篇文章主要針對(duì)bootstrap基礎(chǔ)知識(shí)為大家整理了詳細(xì)的學(xué)習(xí)筆記,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-11-11
比JSON.stringify快兩倍的fast-json-stringify性能對(duì)比分析
這篇文章主要為大家介紹了比JSON.stringify快兩倍的fast-json-stringify性能對(duì)比分析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-12-12
webpack打包node.js后端項(xiàng)目的方法
本篇文章主要介紹了webpack打包node.js后端項(xiàng)目的方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-03-03
某人初學(xué)javascript的時(shí)候?qū)懙膶W(xué)習(xí)筆記
JavaScript對(duì)象就是一組屬性（方法）的集合在該語(yǔ)言中如果變量名或方法名不符合聲明規(guī)范，則一定得用方括號(hào)“ [] ”引用它
2010-12-12
setTimeout自動(dòng)觸發(fā)一個(gè)js的方法
本文為大家介紹下使用setTimeout自動(dòng)觸發(fā)一個(gè)js，具體實(shí)現(xiàn)如下，喜歡的朋友可以學(xué)習(xí)下
2014-01-01