2008年11月28日 星期五

Flash 3D 部落格文章標籤 for Blogger

原文出處: http://www.bloggerbuster.com/2008/08/blogumus-flash-animated-label-cloud-for.html

這個小套件可以將你Blog上的文章標籤以3D方式呈現, 跟隨滑鼠角度移動點選, 主要使用JavaScript and Flash animation。

你可以更改背景顏色, 字體顏色, 大小等參數, 如果觀看者不支援JavaScript與Flash, 雖然沒有動畫效果還是可以點擊。

安裝流程:

1. 先在版面配置HTML中展開小組件狀態下尋找這段程式碼。

<b:section class='sidebar' id='sidebar' preferred='yes'>

2. 在下一行貼上以下程式碼

<b:widget id='Label99' locked='false' title='Labels' type='Label'>  
<b:includable id='main'>  
<b:if cond='data:title'>  
<h2><data:title/></h2>  
</b:if>  
<div class='widget-content'>  
<script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js' type='text/javascript'></script>  
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>  
<script type='text/javascript'>  
var so = new SWFObject(&quot;http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&quot;, &quot;7&quot;, &quot;#ffffff&quot;);  
// uncomment next line to enable transparency  
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);  
so.addVariable(&quot;tcolor&quot;, &quot;0x333333&quot;);  
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);  
so.addVariable(&quot;distr&quot;, &quot;true&quot;);  
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);  
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);  
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);  
so.write(&quot;flashcontent&quot;);  
</script>  
<b:include name='quickedit'/>  
</div>  
</b:includable>  
</b:widget>

這段程式碼中預設參數如下:

1. 寬度為 240px.
2. 高度為 300px.
3. 背景顏色為 #ffffff.
4. 文字顏色為 0x333333.
5. 文字大小為 12.

大家可以將程式碼中這些參數改成自己喜歡的樣式^^, 然後就大功告成...

2 則留言: