AUTO HIDE PADA NAVBAR BLOGGER

Pada post sebelum ni saya menerangkan cara untuk menghilangkan navbar, tetapi pada kali ini saya nak buat auto hide navbar yang ternyata lebih menarik, bagi saya. Navbar pada Blogger sebenarnya mempunyai banyak kegunaannya walaupun kewujudannya akan menyebabkan blog kita tak kelihatan pro.

Seperti yang saya katakan sebelum ini, meghilangkan navbar pada blog melanggar TOS Blogger. Cara penyelesaian yang lebih baik adalah dengan meng'auto hide navbar. Bagaimana tu? Apabila pengunjung mengarahkan mouse ke bahagian atas maka navbar akan muncul, begitu juga sebaliknya apabila pengunjung mengarahkan mouse ke bawah navbar (tidak dalam area navbar) akan dihilangkan. Lagi menarik bukan?!!

Cara memasangnya:

Pada halaman Edit HTML, cari kod body { kemudian letakan kod di bawah ini di atas kod body {
Jangan lupa tick Expand Widget Templates

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

sekiranya anda telah memasang kod untuk menghilangkan navbar sebelum ini, anda hanya perlu menggantikan

kod tersebut dengan kod di atas.

contoh

-----------------------------------------------
Blogger Template Style
Name: Son of Moto (Mean Green Blogging Machine variation)
Designer: Jeffrey Zeldman
URL: www.zeldman.com
Date: 23 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */

#navbar-iframe {
display: none !important;
}

/* Variable definitions
====================

setelah diletak kod auto hide

-----------------------------------------------
Blogger Template Style
Name: Son of Moto (Mean Green Blogging Machine variation)
Designer: Jeffrey Zeldman
URL: www.zeldman.com
Date: 23 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}


/* Variable definitions
====================

Selamat mencuba :)