DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 通過JavaScript控制字體大小的代碼
通過JavaScript控制字體大小的代碼
編輯:關於JavaScript     
為了此代碼到您的網頁必須使用像素大小的字體(PX),而不是相對大小的字體,使用“EM”或“%”。當然如果你使用其他字體單位的代碼可以很容易地適應這些。如果腳本不能找到一個段落的字體大小,它會默認為12px。
核心代碼:
復制代碼 代碼如下:
var min=8;
var max=18;
function increaseFontSize() {
   var p = document.getElementsByTagName('p');
   for(i=0;i<p.length;i++) {
      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {
         var s = 12;
      }
      if(s!=max) {
         s += 1;
      }
      p[i].style.fontSize = s+"px"
   }
}
function decreaseFontSize() {
   var p = document.getElementsByTagName('p');
   for(i=0;i<p.length;i++) {
      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {
         var s = 12;
      }
      if(s!=min) {
         s -= 1;
      }
      p[i].style.fontSize = s+"px"
   }
}

包括上面的代碼在您的網頁(無論是放置在頭部分,或將其放置在一個外部JS文件和進口)。然後可以調用的增加和減少象下面的字體大小的功能。
使用方法:
復制代碼 代碼如下:
<a href="javascript:decreaseFontSize();">-</a>
<a href="javascript:increaseFontSize();">+</a>
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved