Cara Membuat Menu Navigasi Blog Melayang Saat Halaman Discroll ke Bawah
Cara Membuat Menu Navigasi Blog Melayang Saat Halaman Discroll ke Bawah |
Sebelum pulang kerja, Ane sempatkan untuk membagikan cara mudah membuat menu navigasi melayang (tetap muncul) saat halaman di scroll (ditarik ke bawah). Artikel ini saya maksudkan untuk melengkapi artikel membuat blog menjadi semakin edikatif informatif kepada pembaca.
Jika Sobat menggeser halaman blog ini ke bawah, halaman menu navigasi akan tetap muncul dan melayang. Tentu hal ini akan sangat mempermudah rekan-rekan pembaca setia.
Pentingnya Halaman Navigasi Menu Tetap Muncul
Ketika Sobat sedang enak-enaknya membaca artikel dari blog ini, tiba-tiba di bagian akhir memerlukan bantuan dari link internal yang berada di menu navigasi. Maka langkah yang paling mungkin terjadi adalah menggeser scrool ke atas.Hal ini tentu sedikit banyak mengurangi kenyamanan pengunjung. Sehingga, dengan tips inilah akan mempermudah rekan-rekan dalam membaca ulasan-ulasan yang kami berikan.
2. Masuk akun blogger > Template > Edit Html
3. Copy paste kode di bawah ini tepat di atas kode </body>
5. Save template
6. Baca Hamdallah, aamiin.
Langkah-langkah Membuat Menu Navigasi Tetap Melayang
1. Berdo'a2. Masuk akun blogger > Template > Edit Html
3. Copy paste kode di bawah ini tepat di atas kode </body>
<script type='text/javascript'>4. Ganti kode elemen warna biru di atas #nav dengan kode elemen menu navigasi blog Sobat. Biasanya berupa kode .nav atau #menu atau .menu
//<![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>
5. Save template
6. Baca Hamdallah, aamiin.
Baca juga: Cara Mengatasi Algoritma Google Core 2018
OK Guys. Selamat mencoba and happy blogging.
(http://forumblogindo.blogspot.com/).*
OK Guys. Selamat mencoba and happy blogging.
(http://forumblogindo.blogspot.com/).*