Menu Navigasi Selalu Muncul Saat Di Scroll Kebawah Atau Keatas

Seiring dengan perkembangan blogger, tentunya kode-kode yang dibisa diaplikasikan pada blogger sendiri tentunya semakin hari semakin banyak. Contohnya dalam postingan ini kami sedikit berbagi kepada kawan blogger, cara agar menu navigasi pada blog tetap muncul atau ada, saat pengunjung blog menggeser ke bawah atau ke atas halaman ketika sedang berselancar di blog.

Sebagai contoh dari pengaplikasin tutorial ini, bisa ada lihat sendiri menu navigasi pada blog ini. Itulah yang kami maksud dan ingin membagikan cara simplenya untuk kawan blogger semua. Dimana dengan cari ini, sistem navigasi blog mudah dijangkau oleh visitor, karena akan ada setiap saat. Tidak perlu geser lagi ke bagian paling atas untuk mencarinya.

Berikut langkah agar Menu Navigasi Selalu Muncul Saat Di Scroll Kebawah Atau Keatas:
1. Masuk ke bagian Edit HTML, cari kode </body> , caranya tekan ctrl+f, lalu ketik </body> kemudian enter.
2. Setelah itu copy kode dibawah ini, paste di atas kode </body>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
    var stickyNavTop = $('#nav').offset().top;
    var stickyNav = function(){
        var scrollTop = $(window).scrollTop();
        if (scrollTop > stickyNavTop) {
            $('#nav').css({ 'position': 'fixed', 'top':0, 'z-index':9999 });
        } else {
            $('#nav').css({ 'position': 'relative' });
        }
    };
    stickyNav();
    $(window).scroll(function() {
        stickyNav();
    });
});
//]]>
</script>

3. Sehingga akan tampak seperti ini:

4. Terakhir ganti #nav sesuai nama elemen yang digunakan untuk sistem navigasi pada blog anda. Cara mencarinya, silahkan scroll ke bagian menu, contohnya bisa lihat gambar.

5. nav id pada blog kami adalah nav (lihat tanda panah), sehingga pada kode diatas dituliskan #nav. Silahkan sesuaikan dengan blog anda, dan simpan. Terakhir Simpan template dan Lihatlah perubahan yang terjadi. Jika menu belum berubah, silahkan cek dibagian no 4 yaitu cek lagi nama elemen menu.