在實(shí)際的網(wǎng)站建設(shè)工作中，經(jīng)常有一些細(xì)節(jié)的功能，比如網(wǎng)站的字體有時(shí)客戶需要放大看，假如網(wǎng)站里面有這樣的功能，客戶的體驗(yàn)會(huì)明顯增強(qiáng)，那究如何實(shí)現(xiàn)這樣的放大減小的功能呢？
今天我們使用js來實(shí)現(xiàn)，閑話休提，直接上js代碼，具體如下：
var tgs = new Array( 'div','td','tr');
var szs = new Array( 'xx-small','x-small','small','medium','large','x-large','xx-large' );
var startSz = 2;
function ts( trgt,inc ) {
if (!document.getElementById) return
var d = document,cEl = null,sz = startSz,i,j,cTags;
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 ];
}
}
當(dāng)然上面的這一段代碼要放在script標(biāo)簽中，大體里面的意思是實(shí)現(xiàn)放大或是縮小的功能，具體的代碼今天在這兒不講解，我們的目的就是讓你立馬懂得去實(shí)現(xiàn)功能，至于為什么，自己可以去研究研究。
上面是步，接著第二步就是布局好要點(diǎn)擊的文字或圖片，當(dāng)用戶點(diǎn)擊這個(gè)“放大字體”或是“減小字體”的字樣的時(shí)候，觸動(dòng)js代碼，讓某段文字或區(qū)域的字體加大或減小，第二步代碼就很隨意了，每個(gè)網(wǎng)站都是不一樣的，只要記得鏈接的地址就行。
<table width="680" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="right">
<a href="javascript:ts('td01',1)">+ 放大字體</a>
<a href="javascript:ts('td01',-1)">- 減小字體</a>
</td>
</tr>
</table>
關(guān)于上面代碼，只要記住放大鏈接的是：javascript:ts('td01',1)，然后減小鏈接的是：javascript:ts('td01',-1)。
好了，再下面第三步要考慮的就是點(diǎn)擊放大減小字體后，讓哪個(gè)區(qū)域div或class或id的文字字體發(fā)生變化，只需要在某段文字外面加個(gè)id，也就是說，在body里面，可以放些諸如id="td01"這樣的：
<div id="td01">這里面放置的是要改變字體大小的文字</div>
總結(jié)一下，上面分為三步，步，要將js代碼放入script標(biāo)簽中，可以放在head文件中，也可以放入body中。
第二步，放置待點(diǎn)擊放大縮小的文字或圖片字樣，各個(gè)網(wǎng)站情況不一樣，只需記得放大縮小的兩個(gè)鏈接，即javascript:ts('td01',1)與javascript:ts('td01',-1)。
第三步，在body中，把要放大縮小的文字放在id為td01的div或table中。
就這樣簡單，放大或減小字體的功能實(shí)現(xiàn)，懂了嗎，希望會(huì)幫助到大家。
