Widget pada blog sanggup kita buat berjalan mengikuti scroll turun ke bawah, ini akan menciptakan blog Anda menjadi lebih variatif alasannya tidak ada kekosongan pada widget kalau posting Anda cukup panjang dan widget yang Anda pasang sedikit. Kami sarankan untuk widget yang Anda ingin buat mengikuti scroll turun ke bawah sebaiknya widget diletakkan paling akhir/bawah alasannya akan menutup widget yang lain kalau di scroll ke bawah.
Berikut langkah cara menciptakan widget blog mengikuti scroll turun ke bawah :
1. Login akun blogger Anda.
2. Pilih sajian tab Tema > Edit HTML > letakkan kursor pada area arahan HTML.
3. Cari arahan (gunakan Ctrl + F), cari arahan ]]></b:skin>
4. Kemudian letakkan arahan berikut sempurna diatas arahan ]]></b:skin>
.sticky {
position:fixed;
top:10px;/* jarak dari atas*/
z-index: 100;
}
5. Berikutnya cari arahan </body> lalu letakkan arahan berikut diatas arahan </body> position:fixed;
top:10px;/* jarak dari atas*/
z-index: 100;
}
<script type='text/j4vascript'>
$(document).ready(function() {
var stickyWidgetTop = $('#ID_Widget').offset().top;
var stickyWidget = function(){
var scrollTop = $(window).scrollTop();
if (scrollTop > stickyWidgetTop) {
$('#ID_Widget ').addClass('sticky');
} else {
$('#ID_Widget ').removeClass('sticky');
}
};
stickyWidget();
$(window).scroll(function() {
stickyWidget();
});
});
</script>
Keterangan : $(document).ready(function() {
var stickyWidgetTop = $('#ID_Widget').offset().top;
var stickyWidget = function(){
var scrollTop = $(window).scrollTop();
if (scrollTop > stickyWidgetTop) {
$('#ID_Widget ').addClass('sticky');
} else {
$('#ID_Widget ').removeClass('sticky');
}
};
stickyWidget();
$(window).scroll(function() {
stickyWidget();
});
});
</script>
Ganti arahan ID_Widget dengan ID Widget yang akan kalian gunakan.
6. Kalau sudah klik Simpan template.
Semoga bermanfaat! Sumber http://id-pemula.blogspot.com