Cara Membuat Widget Sticky pada Menu Navigasi Agar Menempel Saat Discroll

Berkaca dengan blog-blog yang telah tenar dan menarik untuk dilihat karena terdapat sebagian widget blog mereka yang tetap menempel saat discroll. Hal ini membuat saya pun tertarik untuk membuat hal tersebut, setelah bertanya-tanya ke Paman Google akhirnya ketemulah jawabannya yaitu widget Sticky.
Secara sederhana widget Sticky adalah widget yang tetap menempel di blog saat kursor komputer di gerakan kebawah. Contohnya bisa anda lihat pada blog saya yang sederhana ini. Widget sticky juga menurut saya berguna untuk membuat pengunjugn blog semakin banyak dan betah berlama-lama di blog kita sebab pengunjung akan dengan mudah dan terus melihat tampilan-tampilan menu navigasi pada blog kita. 

Cara membuatnya juga cukup mudah :
1.  Masuk ke Dashboard blog – Edit HTML – cari kode </Body> untuk mempermudah mencarinya  tekan CTRL + F. Perhatikan gambar dibawah ini :
2.    Copy kode berikut ini dan paste tepat 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.   Sebelum disimpan jangan lupa ganti kode widget navigasi pada template anda, seperti kode navigasi pada blog saya di atas yaitu (‘.nav ’)
Sekian cara membuat widget sticky pada menu navigasi yang dapat saya Share kali ini, semoga bermanfaat.

Baca Juga : 

Cara Mudah Pasang Widget Translate Online Untuk Blog di Blogspot

1 komentar so far

Perkenalkan, saya dari tim kumpulbagi. Saya ingin tau, apakah kiranya anda berencana untuk mengoleksi files menggunakan hosting yang baru?
Jika ya, silahkan kunjungi website ini www.kbagi.com untuk info selengkapnya.

Di sana anda bisa dengan bebas share dan mendowload foto-foto keluarga dan trip, music, video, filem dll dalam jumlah dan waktu yang tidak terbatas, setelah registrasi terlebih dahulu. Gratis :)


EmoticonEmoticon