Tutorial Hide-show navigation bar

Hey hey there!! Selamat malam.have a good night session.

Ok lah malam ni Diya nak buat tutorial sikit pasal Tutorial Hide-show navigation bar.Diya yakin dan pasti ramai di kalangan bloggers da delete navigation bar ni kan? dan gantikan dengan Follow&Dashboard button(alaa kau pun sama)..tapi tak ada masalah pun samada korang nak guna navigation bar ke tak nak.Janji bleh sign in blog.kan?

So,perhatian kepada sesiapa yang dah delete Navigation Bar,nak tambah balik boleh follow tutorial di bawah ,ok

Apa itu Hide-show navigation bar? ok korang tengok gambar di bawah ni

Sebelum dihalakan cursor

Selepas dihalakan cursor (psss promo header.kehkeh)

Haaa..nampak kan perbezaannya?

Jom start!

1.Log in to bloggers.

2.Click Design Page Element Add a Gadget HTML Javascript

3.Copy & paste kod di bawah ke ruangan HTML Javascript

<!-- DROPDOWN NAVBAR -->

<!-- stylesheet for FF2, Op9, IE7 (strict mode) -->

<style type="text/css">

#navbar {

display:inline;

width:100%;

position:absolute;

background-color:transparent;

top:-30px;

left:0px;

height:60px;

z-index:999999;

}

#navbar:hover{

top:0px;

height:30px;

}

</style>

<!-- stylesheet for IE6 and lower -->

<!-- (not supporting element:hover) -->

<!-- first, unhide the navbar through css -->

<!-- second, hide the navbar and mimic -->

<!-- the effect with javascript, if available -->

<!--[if lt IE 7]>

<style type="text/css">

#navbar {

height:30px;

top:0px;

}

</style>

<script type="text/javascript">

var navbar = document.getElementById('navbar');

if(navbar){

navbar.onmouseover = function(){

navbar.style.top = '0px';

navbar.style.height = '30px';

}

navbar.onmouseout = function(){

navbar.style.top = '-30px';

navbar.style.height = '60px';

}

if (navbar.captureEvents){

navbar.captureEvents(Event.MOUSEOVER);

navbar.captureEvents(Event.MOUSEOUT);

}

navbar.onmouseout();

}

</script>

<![endif]-->

<!-- end dropdown navbar -->

Senyum,save dan siapp!!!

Perhatian!

Sesiapa yang dah delete navigation bar dia,sila ikut tuto di bawah yer

1.Ok first macam biasa log in to blogger

2.Then click, Design Page Element

3.Click edit pada ruangan Navbar

4.Lepas click,korang pilih warna navbar apa yang korang idamkan

Tekan save dan siapp!!