Membuat Sticky Widget Sidebar Di Blog

Newbie- Selamat Siang kesempatan Kali ini Saya akan Berbagi Tutorial Blog Yaitu Membuat Sticky Widget Sidebar Di Blog

Sticky dalam Bahasa Indonesianya  yang artinya lengket atau menempel sedangkan Sticky Widget Sidebar berarti Membuat Widget Wang selalu Menempel ketika Mouse Di Scrool.

Berikut Ini Tutorial Membuat Sticky Widget Sidebar Di Blog:


1. Tambahkan Code CSS Dibawah ini dan taruh sebelum ]]></b:skin>

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

2. Kemudian Copy Script Dibawah ini Dan Paste Di atas </body>

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

Simpan Dan Lihat hasilnya

Catatan : Ganti HTML7 dengan ID Widget

DEMO

Sekian Cara Membuat Sticky Widget Sidebar Di Blog Semoga bermanfaat

Terimakasih Atas Kunjungannya

Artikel Terkait

Membuat Sticky Widget Sidebar Di Blog

4/ 5

Oleh Teknokrat

Teknokrat 9:15 PM 16 Komentar