土曜日, 8月 25, 2007

動態調整文章字體大小

原作者:Abin
原始文章:http://abintech.azhai.org/2007/01/blog-post.html

這個功能實用性蠻高,每個人的預設字型也不同,最起碼我的是預設較大。不過如果按這個程式,每個按鈕只會進行一次改變字型。如果想按一個按鈕就可以一直改變字型的話,就是自己多多加油了。

建議先進行備份。然後把把下面的Javascript插入模版<head>標籤的前面。
<script type='text/javascript'>
function FontZoom(size)
{
var element = document.getElementsByTagName("div");
var components = new Array();
for(i = 0, j = 0; i < element.length; i++) {
attribute = element[i].getAttribute("id");
if(attribute == "main-wrapper") {
components[j] = element[i];
j++;
}
}
for (i = 0; i < components.length; i++)
components[i].style.fontSize = size+'px';
}
</script>

接着是把以下代碼放到自己喜歡的位置。
<a href="javascript:FontZoom(16)">16</a>
<a href="javascript:FontZoom(14)">14</a>
<a href="javascript:FontZoom(12)">12</a>

括碼裏面的數字就是字型的大小,讀者可以隨自己喜歡來作出修改。

0 件のコメント: