2008年9月15日 星期一

Blogger頁面上方導覽列躲貓貓隱藏法(Peek-A-Boo NavBar)

以前都懶得更新Blogger版面,可是前陣子開始越看越不滿。陸續添加了一些東西后,覺得很亂,又加入收合功能…常常修改HTML,覺得Blogger上方的導覽列,還是有他的用處,至少登入比較方便。乾脆改成平時隱藏,移至畫面上方才出現的躲貓貓導覽列(Peek-A-Boo NavBar)好了。

在 Templates 的< /head >前面加入以下code即可:

<style type='text/css'>
/* ---- Hovering Peek-A-Boo Blogger Navbar ---- */
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}
</style>

這個純CSS的方法適用於IE6、FireFox1.5、Opera 9.0 以後的版本。
在最上方會有一條空白空間(顯示背景色)。可以將整個頁面上移20~30px,或直接設定標頭不頂最上方並與背景色一致就看不出來了。

沒有留言:

張貼留言