Membuat Widget Melayang

Assalamu'alaikum...

Mayasa©. Pernahkah anda melihat ada objek melayang yang dipasang oleh blog yang anda kunjungi? Objek melayang yang dimaksud adalah objek yang terus ada dilayar meskipun scrollbar anda geser keatas ataupun kebawah. Sehingga objek melayangakan selalu terlihat oleh pengunjung. Objek melayang dapat berupa teks, gambar, link, iklan, widget, flash, dan sebagainya.

Jika anda ingin mencobanya, silahkan ikuti langkah-langkah berikut :

1. Login ke Blogger, tentunya dengan email dan password anda masing-masing. Lalu klik Design -> Edit HTML

2. Temukan kode ]]></b:skin> , kemudian letakkan kode dibawah ini diatas kode ]]></b:skin> tersebut.

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

#float:hover {
opacity: 1.0 }

Keterangan:
0.6 (opacity 0.6) merupakan tingkat keredupannya. Semakin kecil nilainya akan semakin redup objeknya. (nilainya mulai dari 0.1 - 1)

Tulisan yang dicetak tebal merupakan posisi objek. Jika anda ingin meletakkan diatas maka gantilah bottom dengan top. Jika anda ingin meletakkan objeknya disebelah kanan maka gantilah left dengan right.

Untuk meletakkan objek ditengah, dapat dilakukan dengan mengatur nilai bottom atau left-nya. Semakin besar nilainya posisi objek akan semakin ketengah.

3. Langkah selanjutnya, cari kode </body> dan letakkan kode berikut diatas </body>

<div id='float'>letakkan konten anda disini</div>

Anda dapat mengganti tulisan yang berwarna ungu dengan kode teks, link, gambar, iklan, atau widget sesuai keinginan anda.

4. Terakhir, klik save template untuk menyimpan template dan lihat hasilnya.

Selamat mencoba...

Waasalamu'alaikum.....

Artikel ini saya posting ulang (istilah lain copas T.T) dengan penyesuaian dari http://www.hermanblog.com