js簡單實現(xiàn)調(diào)整網(wǎng)頁字體大小的方法
更新時間：2016年07月23日 11:24:34 作者：coder
這篇文章主要介紹了js簡單實現(xiàn)調(diào)整網(wǎng)頁字體大小的方法,通過javascript動態(tài)修改頁面元素樣式實現(xiàn)調(diào)整網(wǎng)頁字體的功能,非常簡單實用,需要的朋友可以參考下
本文實例講述了js簡單實現(xiàn)調(diào)整網(wǎng)頁字體大小的方法。分享給大家供大家參考，具體如下：
//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)容感興趣的讀者可查看本站專題：《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript動畫特效與技巧匯總》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運算用法總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計有所幫助。
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)炫酷的彈出式菜單特效，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-01-01
這篇文章主要介紹了理解JavaScript中的window對象,本文通過實例代碼詳細(xì)介紹Window對象的一些重要用途，需要的朋友可以參考下2022-07-07
PixiJS學(xué)習(xí)之如何實現(xiàn)文字的繪制
PixiJS是一個開源的基于web的渲染系統(tǒng)，為游戲、數(shù)據(jù)可視化和其他圖形密集型項目提供了極快的性能。這篇文章主要帶大家學(xué)習(xí)一下PixiJS是如何實現(xiàn)文字繪制的，希望對大家有所幫助2023-02-02
這篇文章介紹了echarts實現(xiàn)餅圖與樣式設(shè)置的方法，文中通過示例代碼介紹的非常詳細(xì)。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-06-06
這篇文章主要介紹了JavaScript中的迭代器和可迭代對象與生成器，文章圍繞主題展開詳細(xì)的內(nèi)容介紹，具有一定的參考價值，需要的小伙伴可以參考一下2022-09-09
javascript顯示倒計時控制按鈕的簡單實現(xiàn)
下面小編就為大家?guī)硪黄猨avascript顯示倒計時控制按鈕的簡單實現(xiàn)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-06-06
JavaScript事件機(jī)制的剖析與優(yōu)化詳解
在現(xiàn)代前端開發(fā)中,JavaScript事件處理是一個至關(guān)重要的部分,它能夠使網(wǎng)頁與用戶交互,實現(xiàn)豐富的交互體驗,然而,對JavaScript事件機(jī)制的深入理解是開發(fā)者成為優(yōu)秀前端工程師的關(guān)鍵所在,本文將全面剖析JavaScript事件機(jī)制,需要的朋友可以參考下2023-12-12
JavaScript中正則表達(dá)式的實際應(yīng)用詳解
這篇文章主要給大家介紹了關(guān)于JavaScript中正則表達(dá)式實際應(yīng)用的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-05-05
防止網(wǎng)站內(nèi)容被小偷采集的js代碼...2006-09-09
如何手動實現(xiàn)一個 JavaScript 模塊執(zhí)行器
這篇文章主要介紹了如何手動實現(xiàn)一個 JavaScript 模塊執(zhí)行器，幫助大家更好的理解和使用JavaScript，感興趣的朋友可以了解下2020-10-10