Memberi Efek Hover pada Gambar yang ada di Header

Adithya Blog kali ini akan share cara Memberi Efek Hover pada Gambar yang ada di Header. untuk demonya silahkan klik demo di bawah ini, lalu coba kamu sorot gambar yang ada di header.

Demo

Berikut Tutorialnya...

• Login ke blogger
• Pilih menu template >> edit HTML >> lanjutkan
• Cari Kode ]]></b:skin> Lalu letakkan code di bawah ini tepat diatasnya...

a.thumbopacity img {  -moz-transition: all 0.3s ease-out;    -o-transition: all 0.3s ease-out;    -webkit-transition: all 0.3s ease-out;    -ms-transition: all 0.3s ease-out;    transition: all 0.3s ease-out;margin-top:5px;margin-left:230px; position:absolute; }
a.thumbopacity:hover img{  margin-left: 175px;  padding-left: 0px;  }

• Sesuaikan letak Gambar kalian dengan mengedit marginnya 
• Lalu copy code di bawah ini dan pastekan tepat dibawah code </head> 

<a class='thumbopacity'>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPaxelSYjDkiTLnpV_QmYU6rcYpL16_JzhAtDCZZ3PynqNIIGiBRXpyD3_XY7hcvibfDi8LbWU3XZXZCiEHR2LfxkcFox07Ta5LbjKPlaMnKOh2wV3weyqUQJLXVBVMLrUI7vh5uxEMnOO/s1600/adada.png'/></a>

• Ubah kode yg berwarna hijau dengan URL gambar kalian 
• Setelah itu simpan HTML kalian dan lihat hasilnya.

Selanjutnya tinggal kalian utak atik sendiri, dan selamat mencoba

Sumber : Adithya-putr4

Backlinks Please Thanks

URL

Code For Forum

HTML Code <a href='http://dedisinaga123.blogspot.com/2013/01/memberi-efek-hover-pada-gambar-yang-ada.html' target='_blank'>Memberi Efek Hover pada Gambar yang ada di Header </a>

Anda Sekarang Sedang Baca Artikel Tentang Memberi Efek Hover pada Gambar yang ada di Header , Boleh Menyebar Luaskan Artikel Ini Atau Mengcopy Paste Artikel Memberi Efek Hover pada Gambar yang ada di Header ini Jika Memang Berrmanfaat. Tapi Saya Harap Anda Jangan Lupa Menyertakan Link Memberi Efek Hover pada Gambar yang ada di Header Sumbernya. Thank's