2012年7月19日 星期四

修改天空部落格的 banner slideshow 為文字跑馬燈

先進入後台管理介面,選擇 [自訂欄位],新增一個自由欄位,按這個新增欄位的 [設定],把以下 javaScript 貼入文本中:

-----------複製此行以下-------------------------------
<script type="text/JavaScript">

var str = '修改這行跑馬燈文字';

var bannerslide = document.getElementById("bannerslide");
if(bannerslide)
{
  var tmpStr = '<table width="90%" border="0" align="center" cellpadding="0" cellspacing="0"> <tr><td style="text-align: left">';
  tmpStr += '<MARQUEE width="720px" style="border-left-style: solid; border-bottom-style: solid; border-right-style: solid; border-top-style: solid; border-left-width: thin; border-bottom-width: thin; border-right-width: thin; border-top-width: thin; border-left-color: rgb(0,0,0); border-bottom-color: rgb(255,255,255); border-right-color: rgb(255,255,255); border-top-color: rgb(0,0,0); padding: 5px; margin: 5px; background-color: rgb(240,240,250); font-family: ';
  tmpStr += "'Courier New', Courier, monospace; font-size: 24px; color: #00F; font-weight:";
  tmpStr += ' bold;"; >';
  tmpStr += str;
  tmpStr += "</MARQUEE></td></tr></table>";

  bannerslide.innerHTML = tmpStr;
}
</script>
-----------複製此行以上------------------------------

修改 str 變數的字串就可以用了

這個修改的關鍵只是把 ID 為 "bannerslide" 的 <div> 內容更換為文字跑馬燈的功能而已,原本其內放的是 banner slideshow。


我是如何知道這個 <div> 的 ID 呢,我是藉由 DebugBar 這個軟體工具的幫忙找出來的,可以在網路上找到









沒有留言:

張貼留言