Cara Buat Float Widget Melayang

Pembahasan sebelumya saya sudah menjelaskan tentang Cara Menampilkan Status YM di Blog, nah sekarang bagaimana caranya agar memebuat status YM kita melayang - layang "Widget melayang". fungsinya jika anda menggeser scroll bar browser widget ini, status YM akan selalu berada ditempatnya dan tidak mengikuti scroll bar alias hanya diam ngak bergerak sama sekali. Jika kurang jelas silahkan contoh gambar dibawah ini :



Seperti yang kamu lihat sekarang di bagian pojok kiri bawah ada sebuah widget yang melayang layang di halaman blog saya ini, kalo pengen tahu cara membuatnya begini caranya:
Begini cara membuatnya :
Langkah pertama anda masuk ke menu Layout atau Tata Letak kemudian masuk Edit HTML Lalu taruh Code dibawah ini diatas Code ]]></b:skin>





#melayang {
position:fixed;_position:absolute;bottom:5px;left:5px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }






Huruf yang berwarna biru diatas adalah posisi widgetnya "Widget Melayang" bottom adalah atas sudut kanan jika ingin menaruh di bawah kamu bisa ganti dengan top dan left adalah kanan jika ingin mengganti di kiri bisa kamu ganti dengan right.
Langkah selanjutnya taruh code dibawah ini yang merupakan widget kamu sebelum kode </body>





<div id="melayang">
 --Masukkan kode widget kamu disini--

</div> 


Kemudian SAVE, dan lihat hasilnya





SELAMAT MENCOBA



1 komentar :

silakan berkomentar.. :)