Membuat Sticky Widget Pada Blog

Fungsi sticky widget adalah agar sebuah widget menjadi seperti melayang saat tombol scroll digunakan ke bawah. Dan saat discroll ke atas, maka widget terebut akan kembali ke tempat semula.

Script by Arlina Fitriyani

Caranya

Sebagai contoh, saya akan menerapkan fungsi sticky pada widget dengan ID HTML3
Letakkan kode dibawah ini diatas kode </body>

JS<script type='text/javascript'>
//<![CDATA[
// Sticky Widget
function makemeSticky(e){function t(){var e=s.getBoundingClientRect();e.top<0?(n.className=a+" makesticking",n.style.width=i+"px"):n.className=a}var n=document.getElementById(e),s=document.createElement("div");n.parentNode.insertBefore(s,n);var i=n.offsetWidth,a=n.className+" makesticky";window.addEventListener("scroll",t,!1)}makemeSticky("HTML3;");
//]]>
</script>

Ganti kode HTML3 dengan ID Widget kalian

Setelah itu letakkan kode di bawah ini diatas ]]></b:skin>

CSS.makesticking{background:none!important;position:fixed!important;top:25px;z-index:99;-webkit-transform:translateZ(0)}#HTML3 .widget-content{padding:0;margin:auto}

Ganti kode HTML3 dengan ID Widget kalian

Simpan Template.

Tentang Unknown

Saya adalah seorang blogger iseng yang secara iseng membuat blog iseng untuk sekadar iseng isengan.

Share this

Related Posts