Cara Membuat Navigasi Blog Melayang Setelah di Scroll

Cara Membuat Navigasi Blog Melayang Setelah di Scroll - Pada postingan artikel ini saya akan berbagi Tips mengenai bagaimana membuat Navigasi / Menu Menjadi Melayang Setelah Di Scroll, pasti anda pernah melihat kan blog atau website yang menggunakan STICKY (Navigasi Blog Melayang Setelah di Scroll) Dengan demikian pengunjung akan merasa lebih nyaman untuk mengakses semua laman yang ada dalam blog anda tanpa harus repot - repot scrool ke halaman atas lagi untuk mencari menu navigasinya ..
Langsung saja berikut adalah cara-caranya :

DEMO

• Login Ke akun Blogger (pastinya :D)
• Pilih Tab Template Lalu pilih Edit HTML
• Cari Kode </body> ( dengan Menggunakan Ctrl + F )
• Copy semua Code yang ada dibawah ini

<script type='text/javascript'> //<![CDATA[ $(document).ready(function() { // Menentukan elemen yang dijadikan sticky yaitu .nav var stickyNavTop = $('.nav').offset().top; var stickyNav = function(){ var scrollTop = $(window).scrollTop(); // Kondisi jika discroll maka menu akan selalu diatas, dan sebaliknya if (scrollTop > stickyNavTop) { $('.nav').css({ 'position': 'fixed', 'top':0, 'z-index':9999 }); } else { $('.nav').css({ 'position': 'relative' }); } }; // Jalankan fungsi stickyNav(); $(window).scroll(function() { stickyNav(); }); }); //]]> </script>

• Lalu Pastekan Kode Diatas Tepat Diatas Kode </body>
• Setela itu Klik Simpan Template dan Lihat Hasilnya :D 

Jika Masih Ada Pertanyaan Silahkan Komentar di bawah !

~~~~~Semoga Bermanfaat~~~~

Tweet