全網最全的博客美化系列教程相關文章目錄
【全網最全的博客美化系列教程】01.添加Github項目鏈接
【全網最全的博客美化系列教程】03.給博客添加一只萌萌噠的小倉鼠
【全網最全的博客美化系列教程】05.公告欄個性時間顯示的實現
【全網最全的博客美化系列教程】06.推薦和反對炫酷樣式的實現
【全網最全的博客美化系列教程】09.添加"擴大/縮小瀏覽區域大小" 按鈕
【全網最全的博客美化系列教程】10.小火箭置頂特效的實現
【全網最全的博客美化系列教程】11.鼠標點擊愛心特效的實現
【全網最全的博客美化系列教程】12.修改鼠標圖案
【全網最全的博客美化系列教程】13.鼠標點擊效果升級的實現
【全網最全的博客美化系列教程】14.代碼高亮設置的實現
【全網最全的博客美化系列教程】15.動畫幻燈效果的實現
【全網最全的博客美化系列教程】16.給博客添加一個打賞的實現
【全網最全的博客美化系列教程】17.博客背景刷新切換效果的實現
【全網最全的博客美化系列教程】18.數學之美---動態幾何線條的實現
【全網最全的博客美化系列教程】20.給博客添加一個萌萌噠的看板娘
【全網最全的博客美化系列教程】21.給博客添加一個夜間模式吧
【全網最全的博客美化系列教程】22.添加一個文章目錄特效
【全網最全的博客美化系列教程】23.圖片水紋特效的實現
【全網最全的博客美化系列教程】24.給博客增加一個音樂播放器特效
【全網最全的博客美化系列教程】25.給博客增加一個音樂播放器特效
【全網最全的博客美化系列教程】26.評論頭像旋轉的實現
【全網最全的博客美化系列教程】27.IP地址定位及天氣預報的實現
【全網最全的博客美化系列教程】28.3D標簽雲動畫的實現
【全網最全的博客美化系列教程】29.自制HTML源碼運行Javascript特效
【全網最全的博客美化系列教程】30.博客文章實現markdown書寫機制
【全網最全的博客美化系列教程】31.用Canvas和requestAnimFrame做動畫特效
【全網最全的博客美化系列教程】32.公告欄添加自己的頭像
【全網最全的博客美化系列教程】33.添加一只舞動的小知音
【全網最全的博客美化系列教程】34.皮膚背景的選擇與定制
公告欄個性時間顯示的實現
相信大家也看到了右側公告欄的動態時鍾的效果，是不是感覺還挺不錯的？
本文就帶大家一起詳細了解這個樣式的制作過程~~~
這個我們通過F12去查看下源碼，我們可以看到如下圖這段源碼：
我們仔細看看，似乎你會發現，把這些貼上去以后都沒有效果，這是怎么回事呢？
這是一個Flash插件，swf是一種動畫格式，實現效果應該是下面的Object內容
然后為了方便起見，其實這個內部已經封裝成js代碼了，只需要把下面這段代碼復制即可~~
<script charset="Shift_JIS" src="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_tr.js"> </script>
添加方式：進入自己的博客園->設置，將以上html代碼添加到“博客側邊欄公告”
原理：學過js的會知道，就是引用了一個封裝好的js，內部實現機制是Flash。
添加以后的效果如下：
更多風格請移步至這里：http://chabudai.org/blog/?p=59
這里提供了兩種不同的樣式，一個是背景透明，一個是背景白色，都提供了相應的源碼，你只需要復制到指定位置即可~~
