Cara Menambahkan Efek hover gambar pada blogger

Cara Menambahkan Efek hover gambar pada blogger

1.Log in ke dashboard Anda -> layout -> Edit HTML

2.Scroll ke mana Anda melihat </ head> Tag

3.Copy dan Paste di bawah kode CSS diatas Tag  ]]></b:skin>


a.linkopacity img {
filter: alpha (opacity = 50);
-moz-opacity: 0.5;
opacity: 0.5;
-KHTML-opacity: 0.5;}

a.linkopacity: hover img {
filter: alpha (opacity = 100);
-moz-opacity: 1.0;
opacity: 1.0;
-KHTML-opacity: 1.0;}


4.Now Klik "Simpan Template"

Sekarang setiap kali Anda menanamkan gambar Anda dalam posting blog atau blog Anda menggunakan kode seperti di bawah ini.

<a href="target URL nama image" target="_blank" alt="Any Anda Anda like"> src="Link <img dari image"/> Anda </ a>

Lihatlah contoh di bawah ini.

<a target="_blank" href="http://seoganas.blogspot.com/" alt="Blogger Tips"> <img src = "http://i626.photobucket.com/albums/tt346/wam8387/toyotacar- 2.jpg "/> </ a>



5.Replace atas kode dengan kode di bawah ini untuk memiliki efek hover ..

<a class="linkopacity" href="target URL nama image" target="_blank" alt="Any Anda Anda like"> <img src="Link dari image"/> Anda </ a>
Ini akan terlihat seperti ini.

<a class="linkopacity" href="http://seoganas.blogspot.com/" target="_blank" alt="Blogger Tips"> <img src = "http://i626.photobucket.com/albums/tt346 / wam8387/toyotacar-2.jpg "/> </ a>