Sebelumnya Armaila ada sharing tentang cara membuat box iklan melayang saat discroll kebawah. Namun setelah Armaila mencoba mengaplikasikannya di web pulsa Apn.AkhirMali.com ternyata tidak berfungsi.
Akhirnya admin menemukan "Cara Membuat Widget Sticky pada Sidebar di Blogspot Widget Melayang Blogger Versi 2" dan cara ini berhasil untuk template frontier yang admin terapkan per tanggal 7 Juli 2020 ini.
Cara Membuat Widget Sticky pada Sidebar di Blogspot Widget Melayang Blogger Versi 2
1. login akun blogger anda.
2. Pilih Template kemudian Edit HTML, kemudian pasang kode berikut ini tepat diatas kode </head>
<!-- STICKY https://blogger.armaila.com/2020/07/cara-membuat-widget-sticky-pada-sidebar-blog-versi-2.html -->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(function () {
var offset = $("#HTML1").offset();
var topPadding = 0;
$(window).scroll(function () {
if ($(window).scrollTop() > offset.top) {
$("#HTML1").stop().animate({
marginTop: $(window).scrollTop() - offset.top + topPadding
})
} else {
$("#HTML1").stop().animate({
marginTop: 0
})
}
})
});
</script>
<!-- STICKY END -->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(function () {
var offset = $("#HTML1").offset();
var topPadding = 0;
$(window).scroll(function () {
if ($(window).scrollTop() > offset.top) {
$("#HTML1").stop().animate({
marginTop: $(window).scrollTop() - offset.top + topPadding
})
} else {
$("#HTML1").stop().animate({
marginTop: 0
})
}
})
});
</script>
<!-- STICKY END -->
Ganti #HTML1 dengan ID widget yang ingin dibuat melayang (sticky).