√ Membuat Sticky Widget Sidebar di Blogspot

Membuat Sticky Widget Sidebar di Blogspot

5/04/2014

Sticky widjet pada sidebar blog. Pernah lihat sticky widget pada sidebar. Kalo belum coba scroll dan lihat disidebar kanan blog ini . Pasti ada satu widget yang tidak terprengaruh oleh scroll, dan akan selalu mengikuti . Yaa.. itulah sticky atau menempel.

Untuk membuat sticky widjet cukup mudah, silahkan disimak.

1. Login ke blogger.com

2. Klik Template >> Edit HTML

3. Lalu tambahkan kode CSS berikut ini diatas ]]></b:skin>

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

4. Simpan kode berikut diatas </body>

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

5. Ganti HTML2 dengan ID widjet yang akan dibuat sticky atau menempel.

6. Save template . Dan bisa langsung melihat hasilnya. Sekian.

kazvampires 5/04/2014