【全網最全的博客美化系列教程】05.公告欄個性時間顯示的實現

全網最全的博客美化系列教程相關文章目錄

【全網最全的博客美化系列教程】01.添加Github項目連接

【全網最全的博客美化系列教程】02.添加QQ交談連接

【全網最全的博客美化系列教程】03.給博客添加一隻萌萌噠的小倉鼠

【全網最全的博客美化系列教程】04.訪客量統計的實現

【全網最全的博客美化系列教程】05.公告欄個性時間顯示的實現

【全網最全的博客美化系列教程】06.推薦和反對炫酷樣式的實現

【全網最全的博客美化系列教程】07.添加一個分享的按鈕吧

【全網最全的博客美化系列教程】08.自定義地址欄Logo

【全網最全的博客美化系列教程】09.添加"擴大/縮小瀏覽區域大小" 按鈕

【全網最全的博客美化系列教程】10.小火箭置頂特效的實現

【全網最全的博客美化系列教程】11.鼠標點擊愛心特效的實現

【全網最全的博客美化系列教程】12.修改鼠標圖案

【全網最全的博客美化系列教程】13.鼠標點擊效果升級的實現

【全網最全的博客美化系列教程】14.代碼高亮設置的實現

【全網最全的博客美化系列教程】15.動畫幻燈效果的實現

【全網最全的博客美化系列教程】16.給博客添加一個打賞的實現

【全網最全的博客美化系列教程】17.博客背景刷新切換效果的實現

【全網最全的博客美化系列教程】18.數學之美---動態幾何線條的實現

【全網最全的博客美化系列教程】19.旋轉立方體的實現

【全網最全的博客美化系列教程】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

這裏提供了兩種不一樣的樣式，一個是背景透明，一個是背景白色，都提供了相應的源碼，你只須要複製到指定位置便可~~