Assalamualaikum wr.wb
Kemarin telah dibahas Cara Melihat ID Widget Pada Blog, maka sekarang akan saya bahas cara untuk membuat sidebar menjadi sticky widget. Sticky Widget itu merupakan sebuah widget yang melayang. Jadi, widget yang kita buat sticky ini akan melayang walaupun kita scrool ke yang paling bawah juga.
Related Articles
Jika ingin mencobanya silahkan ikuti langkah berikut ini:
- Pertama cari dahulu kode ]]></b:skin>
- Jika sudah ditemukan maka simpan kode dibawah ini tepat diatas kode ]]></b:skin>
.sticky {
position:fixed;
top:10px;/* jarak dari atas*/
z-index: 100;
}
- Lalu cari kode </body>
- Kemudian simpan kode dibawah tepat diatas kode </body> tadi
$(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>
Note: ganti kode yang berwarna hijau dengan ID widget yang akan dibuat sticky. Jika belum tau cara melihat ID widgetnya bisa lihat di artikel Cara Melihat ID Widget Pada Blog
- Jika semua langkah diatas sudah dilakukan maka klik Simpan lalu lihat hasilnya
Dicukupkan sekian dari saya.
Semoga bisa menjadi manfaat.
Wassalamualaikum wr.wb