Cara Membuat Widget Sticky di Sidebar Blog

Di hari ini taukahbahwa.blogspot.com akan menyampaikan artikel tentang Cara Membuat Widget Sticky di Sidebar Blog. Semoga dengan berita Cara Membuat Widget Sticky di Sidebar Blog akan menambah pengetahuan untuk anda pembaca setia taukahbahwa.blogspot.com

Cara Membuat Widget Sticky di Sidebar Blog - Halo sobat di pagi hari ini saya akan memberikan tutorial sedikit mengenai tentang bagaimana  Cara Membuat Widget Sticky di Sidebar Blog . sobat pasti sudah tau apa itu widget sticky . yups benar sekali widget stiky adalah widget yang selalu menempel atau melayang meskipun kita scroll kebawah . untuk demonya sobat coba scroll ke bawah dan lihat disidebar saya pasti ada widget sticky nya yang selalu menempem atau melayang pada sidebar .

Berikut cara mudah membuat widget sticky pada sidebar blog. :
Ada dua langkah untuk membuat widget sticky ini

A. DENGAN MENAMBAH KODE CSS

1. Login ke Blogger
2. Klik Template > Edit HTML
3. Tambahkan kode CSS di bawah ini di atas ]]></b:skin>

.sticky {
  position:fixed;
  top:5px;/* jarak dari atas*/
  z-index: 100;
}

B.TAMBAHKAN JAVASCRIPT

Simpan kode ini di atas </body>

<script type='text/javascript'>
$(document).ready(function() {
var stickyWidgetTop = $('#HTML1').offset().top; 
var stickyWidget = function(){
var scrollTop = $(window).scrollTop();     
if (scrollTop > stickyWidgetTop) { 
    $('#HTML1').addClass('sticky');
} else {
    $('#HTML1').removeClass('sticky'); 
}
};
stickyWidget();
$(window).scroll(function() {
    stickyWidget();
});
});
</script>

Ganti #HTML1 dengan ID widget yang akan dibuat sticky. Taraaa selamat anda sudah dapat membuat widget sticky pada blog sobat . Demikian artikel saya tentang Cara Membuat Widget Sticky di Sidebar Blog semoga bermanfaat bagi anda , jika ada pertanyaan silahkan bertanya pada saya . ok akhirul kalam wassalaammualaikum wr.wb.

Dapatkan berita terupdate dan unik setiap saat hanya di taukahbahwa.blogspot.com

Homepage|http://taukahbahwa.blogspot.com