Home » » Memberi Efek Hover pada Gambar di Header

Memberi Efek Hover pada Gambar di Header


                          



kali ini saya 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      (arahkan kursor ke gambar di header)                                                              


caranya....

>>>  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='http://2.bp.blogspot.com/-s4JmE8cyXMI/UNao2BeJUoI/AAAAAAAABW0/lkxbmI4OHkE/s1600/adada.png'/></a>



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


0 komentar:

Posting Komentar

x - blogger yang baik meningal jejak dengan berkomentar
x - dilarang spam
x - kata-kata yang sopan dan baik
x - berkomentar menggunakan Name/URL
-> isikan nama anda
->URL di kosongkan -> klik lanjutkan

''_'' terima kasih sudah berkunjung ''_''

Translate

Followers

Me Gusta - Rage Face Comics

Visitor