Assalamualaikum wr.wb
Setelah membahas cara untuk membuat sidebar menjadi sticky pada artikel yang kemarin maka sekarang akan saya lanjutkan saja dengan Cara Membuat Menu Navigasi Menjadi Sticky.
Untuk penjelasan sticky mungkin tidak usah saya ulang kembali, intinya saja sticky itu artinya melayang, jadinya widget melayang.
Related Articles
Jika ingin mencobanya ikuti langkah berikut:
- Pertama login dahulu ke akun blogger kalian
- Klik Template
- Klik Edit HTML
- Lalu cari kode </body>
- Kemudian simpan kode dibawah ini tepat diatas kode </body>
//<![CDATA[
$(document).ready(function() {
// Menentukan elemen yang dijadikan sticky yaitu #NavbarMenu
var stickyNavTop = $('#NavbarMenu').offset().top;
var stickyNav = function(){
var scrollTop = $(window).scrollTop();
// Kondisi jika discroll maka menu akan selalu diatas, dan sebaliknya
if (scrollTop > stickyNavTop) {
$('#NavbarMenu').css({ 'position': 'fixed', 'top':0, 'z-index':9999 });
} else {
$('#NavbarMenu').css({ 'position': 'relative' });
}
};
// Jalankan fungsi
stickyNav();
$(window).scroll(function() {
stickyNav();
});
});
//]]>
</script>
Note: Ganti kode berwarna hijau dengan kode element pada menu navigasi di blog kalian.
- Jika sudah maka klik Simpan
- Semoga Berhasil!
Itulah Cara Membuat Menu Navigasi Menjadi Sticky Widget.
Jangan lupa untuk share artikel ini kepada teman-teman kalian ya.
Terimakasih.
Wassalamualaikum wr.wb
Wassalamualaikum wr.wb
