
TutorNesia ~ Widget Sticky fungsinya adalah ketika blog/web di scroll kebawah maka widget tersebut akan menempel atau melayang di atas sidebar meski di scroll kebawah. Tampilan ini sebetulnya memudahkan pengunjung untuk melihat berita blog kita atau sekedar menghias sidebar biar tidak tampak kosong walau artikel yang kita publish sepanjang ular.
Simpan Script ini pas diatas kode
</body> atau </head>.<script>
//<![CDATA[
bs_makeSticky("HTML3");
function bs_makeSticky(elem) {
var leony_sticky = document.getElementById(elem);
var scrollee = document.createElement("div");
leony_sticky.parentNode.insertBefore(scrollee, leony_sticky);
var width = leony_sticky.offsetWidth;
var iniClass = leony_sticky.className + 'leony_sticky';
window.addEventListener('scroll',leony_sticking, false);
function leony_sticking() {
var rect = scrollee.getBoundingClientRect();if (rect.top < 0) {
leony_sticky.className = iniClass + ' leony_sticking';
leony_sticky.style.width = width + "px";} else {
leony_sticky.className = iniClass;}}
}
//]]>
</script>
<style>
.leony_sticking {background:none !important; position:fixed; top:6px;}
</style>Pastikan id sticky anda di isi dengan benar, contoh id sticky saya (HTML3). Dan biasa id sidebar akan berupa kode seperti dibawah ini.
<b:section class='sidebar' id='sidebar' showaddelement='yes'>
<b:widget id='HTML1' locked='false' title='Comment' type='HTML'>
<b:widget id='PopularPosts2' locked='false' title='Populer Post' type='PopularPosts'>
<b:widget id='HTML3' locked='false' title='Misteri' type='HTML'>Pastikan id sidebar yang mau di sticky itu adalah id paling bawah, karena jika anda menggunakan id tengah atau atas maka sudah dapat dipastikan berantakan. Jika masih bingung silahkan tinggalkan komentar anda dibawah ini.
Baca Juga Artikel Terkait Lainnya
Silahkan bertanya sesuai dengan artikel yang telah anda baca diatas.
Link aktif otomatis terseleksi ke SPAMMER.
Alasan komentar anda tidak terjawab adalah OOT atau diluar kemampuan Admin.