Februari 29, 2012

Membuat Ruang Float (Melayang) Untuk Widget Dengan Css

Situseo Blog : Script membuat ruang untuk menempatkan berbagai widget supaya Float atau Melayang sangat berguna untuk mengurangi ruang sidebar yang sudah penuh dengan berbagai widget, dengan script css ini kita bisa menempatkan atau menambahkan berbagai macam widget supaya widget tersebut melayang statis pada tempatnya walaupun melakukan scroll mouse.

Biasanya widget-widget yang melayang adalah widget back to top dan widget share count, dengan mengunakan script ini widget selain yang disebutkan tadi bisa dibuat float/melayang, seperti contoh pada situseo blog saya memasang widget online count yang didapat dari histats (kalau belum saya rubah).

Untuk membuat widget kalian melayang, kalian bisa menggunakan script dibawah ini untuk mewujudkannya.

CSS
#kontes {
background-color:transparent;
border:1px solid #C1CDCD;
left:5px;
bottom:33px;
margin-top:10px;
position:fixed;
width:64px;
}
#kontes .float {
margin:0 0 0 680px;
}

HTML
<div id='kontes'>
<div class='float'>
Widget Kalian Disini
</div></div>

Posisi float widget bisa kalian tentukan letaknya dengan merubah pada bagian css #kontes .float pada bagian margin-nya, keterangan Widget Kalian Disini merupakan tempat untuk meletakan script widgetnya, script ini sangat ringan karena menggunakan css.

Semoga bermanfaat,

4 Diskusi untuk Membuat Ruang Float (Melayang) Untuk Widget Dengan Css

1 Maret 2012 pukul 22.43  

Saya biasa pakai widget melayang untuk tombol back to top..

11 Maret 2012 pukul 23.18  

kok gak bisa ya saya --"

11 Maret 2012 pukul 23.52  

@smileordinary : coba kode css-nya ditempatkan diatas ]]></b:skin> dan html-nya dipasang sebagai widget

9 Oktober 2012 pukul 22.56  

nambah :
@smileordinary : html dipasang diatas < /body > agar tidak berat.

Posting Komentar

supaya diskusi berjalan baik, gunakan tombol jawab untuk reply. penggunaan tombol jawab, jangan menghapus kode komentar pada kotak komentar, cukup mengetikan komentar disebelah atau dibawah kode komentar. Terima kasih.

rate this post
beri nilai posting ini
Terima kasih,
Ping your blog, website, or RSS feed for Free Web DirectoryMy Ping in TotalPing.comBloggers - Meet Millions of Bloggers
Protected by Copyscape Duplicate Content Check

Template by Dicas Blogger | Modifikasi ulang oleh Mas Dalang

101011  ©Situseo Blog | Powered by Blogger | Back to Top