Google PageRank Checker Powered by  MyPagerank.Net

Translate



Cara Membuat Float Image (Gambar Melayang) Pada Blog




Pada kesempatan kali ini kita akan belajar bagaimana membuat float image (gambar melayang) pada blog. Sobat bisa lihat pada pojok kiri atas dan bawah dari blog ini, ada 1 buah gambar yang terus berada pojok browser yang selalu mengikuti kursor dari mouse. Itulah yang dimaksud dengan float image. Cukup mempercantik tampilan blog kita kan?

Kelebihan dari float image ini adalah selain memperindah blog juga dapat kita sisipi link. Sehingga jika ada yang mengklik link tersebut maka akan langsung menuju ke tautan yang telah ditentukan.


Tertarik untuk mencobanya?
Langsung saja langkah-langkah pembuatannya adalah sebagai berikut:

1. Login blogger dan langsung menuju ke Design > Edit HTML.

2. Cari kode berikut (bisa menamnfaatkan Ctrl+F)

]]></b:skin>

3. Taruh kode berikut diatas kode ]]></b:skin>

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

4. Kemudian letakkan kode dibawah ini diatas kode </body>

<div id="trik_pojok">
<a href="http://gomedblogger-666.blogspot.com/">
<img src="http://goo.gl/vMmYq" border="0" /></a>
</div>


NB: 
Kata yang dicetak tebal adalah link yang akan berfungsi pada float image. Sobat bisa mengganti link tersebut sesuai keinginan sobat. Selanjutnya kata dicetak miring adalah sumber gambar dari float image. Sobat bisa menggantinya dengan logo sobat sendiri.


5. Terakhir simpan perubahan pada template sobat dan lihat hasilnya.

Bagaimana? Cukup mudah bukan? Selamat mencoba!

GOOD LUCK






2 komentar:

  1. selamat menyambut tahun baru 2013,semoga makin sukses.
    tutornya boleh juga bro....ane simpan dulu nih,buat experimen :)

    BalasHapus
  2. amiin , thanxz om buat kunjungannya :) , semoga makin sukses juga amiin :)

    BalasHapus

Pengikut

 

Label


SEO Stats powered by MyPagerank.Net
Corat Coret
Dibuka dong ahh

Flag Counter
Corat coret © 2012-2013 | Template By Muchamad Ragil Saputra