Navbar Blogger Menggunakan JQuery

Postingan yang berhubungan dengan Navbar, sebelumnya saya sudah membahas bagaimana Cara Membuat Auto Hide Navbar dan Cara Menghilangkan Navbar. Kali ini saya akan membahas mengenai Navbar Blogger Menggunakan JQuery.

Cara ini menggunakan JavaScript agar Navbar bisa menjadi transparan dan sobat bisa mengatur efek transparan Navbar ini mulai dari 0% (Kondisi Normal) sampai 100% (Tidak Kelihatan).
Jika sobat ingin mencoba silahkan simak cara berikut ini:

1. Login ke Blogger
2. Klik Rancangan
3. Klik tab Edit HTML
4. Klik tulisan Download Template Lengkap.
5. Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula.
6. Beri tanda centang pada kotak di samping tulisan Expand Template Widget.
   Kemudian cari kode </head>

Tips : Untuk mempercepat pencarian sobat bisa gunakan tombol Ctrl + F atau (F3).
Jika sudah ketemu copy kode di bawah ini dan paste di atas kode tadi.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$("#navbar").fadeTo("slow",
0.1
);
$("#navbar").hover(function(){
$(this).fadeTo("slow",
1.0
);
},function(){
$(this).fadeTo("slow",
0.1
);
});
});
</script>

Keterangan : Angka 0.1 menunjukkan efek transparan dari Navbar sebesar 90% dan jika ingin tidak kelihatan sama sekali ganti angka 0.1 dengan 0.0.

Jika sobat ingin Navbar tetap dalam kondisi transparan ketika mouse di arahkan ganti angka
1.0 yang menjadi 0.75 untuk mendapatkan efek transparan sebesar 25%.

Selesai, lihat perubahan klik PRATINJAU dan jika sudah sesuai dengan keinginan klik tombol SIMPAN TEMPLATE.

Dari berbagai sumber