Cara Membuat Menu Floating Image

Oke yang pertama-tama dan terutama mari kita baca basamalah untuk memulai posting ini agar tidak terjadi hal-hal yang tidak di inginkan. 
bismi-llāhi r-raḥmāni r-raḥīm

Oke sekarang mari kita bahas apakah itu menu floating image? menu floating adalah menu yang memiliki posisi tetap/fixed, berada di kanan/kiri dan atas/bawah. Sedangkan image adalah gambar. Berarti dapat di artikan bahwa menu floating image adalah menu floating yang menggunakan gambar. Jika anda seorang kaskuser, maka anda sering menjumpai tampilan seperti ini. 
Floating
Itu yang di tunjuk panah merah yang saya maksud floating. Nah sekarang kita langsung ke cara pembuatannya aja ya. Step,By.Step!!!
1. Log in ke blog anda dengan akun anda.
2. Masuk ke design > Edit HTML
3. Cari kode ]]></b:skin> 
4. Copy dan paste kode berikut di atas kode ]]></b:skin> 
#floating {
position:fixed;_position:absolute;top:170px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
Keterangan : kode yang berwarna merah dapat anda ganti sesuai keinginan. top=atas bisa di ganti dengan bottom= bawah. left=kiri dapat di ganti dengan right=kanan
5. cari kode </body>
6. Copy dan past kode ini di atas kode </body>
<div id="floating">
<a href="http://abi-galoga.blogspot.com">
<img src="http://i953.photobucket.com/albums/ae17/abi-galoga/Untitled-2.jpg" border="0" /></a>
</div>
Yang berwarna merah ganti dengan Link anda dan yang berwarna bira ganti dengan alamat gambar anda.

Selesai sudah posting kali ini. Jika berhasil ucapakan Alhadulillah jika gagal jangan menyerah!coba lagi !
Saya akhiri wasalam, jangan lupa comment

1 komentar:

Anonymous, 3 September 2013 at 01:58 | [Reply]

terima kasih tutorialnya mas bro

Post a Comment

Kotak Komentar Klasik Klik Di sini

« Prev Next » Home