2005年12月20日 星期二

Blogger功能加強 - 調整文章內容的字型大小

參考資料:
Kaie's Blog - [Javascript] Selectable Post Font Size for your best view!


Step 1. 將以下程式碼放在]]></b:skin>之後,</head>之前。

<script type='text/javascript'>
function getElementsByName_iefix(tag, name) {
var elem = document.getElementsByTagName(tag);
var arr = new Array();
for(i = 0,iarr = 0; i < elem.length; i++) {
att = elem[i].getAttribute("name");
if(att == name) {
arr[iarr] = elem[i];
iarr++;
}
}
return arr;
}

function doZoom(size)
{
var zooms = getElementsByName_iefix("span", "zoom")
for (var i = 0; i < zooms.length; i++) {
zooms[i].style.fontSize = size+'px';
}
}
</script>


Step 2. 在範本中找到所有

<p><data:post.body/></p>

均置換成

<span name='zoom'>;<p><data:post.body/></p></span>

<span name="zoom"></span>所包住的部份就會有縮放字型的功能。

Step 3. 最後在想要加入此功能的位置上,置入以下的程式碼。

<a href="javascript:doZoom(16)">大</a>
<a href="javascript:doZoom(14)">中</a>
<a href="javascript:doZoom(12)">小</a>


其中紅色部份的數字可以自行調整。
blogger的預設好像是13