Tutorial gambar timbul bila cursor sentuh

ada request la pulak daripada blogger yang tak dikenali..saya tak dapat tengok blog dia coz dia tak tinggalkan link dia..apa2 dah orang request tuto kenalah tunaikan...

tak mau cakap panjang lebar...JOM kita mulakan tutorial

1)dashboard>design>edit html>tick expand widget

2)tekan ctrl+F untuk memudahkan pencarian.cari kod dibawah nie

/* Header

 3)dah jumpa ke belum??kalau dah jumpa copy kod dibawah dan paste diatas kod yang dicari tadi

/*------ IMAGE ANIMATION------*/
img {filter:alpha(opacity=100);
-webkit-transition-duration:.5s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px 20px #000000; -moz-box-shadow: 0px 0px 20px #000000; -webkit-border-top-right-radius:30; -webkit-border-top-left-radius:30; -webkit-border-bottom-right-radius:30; -webkit-border-bottom-left-radius:30;}img:hover {filter: alpha(opacity=60); opacity: .60; border: 1px solid#000000; border-radius: 50px; -moz-border-radius: 50px;}
-moz-opacity:1.0;
opacity:1.0;
}
img:hover {
filter:alpha(opacity=80);
-moz-opacity:0.80;
opacity:.80;
}
u {
text-decoration:underline;
border-bottom: 2px dotted #ff0080;
padding: 0px;
}

4)save la dulu kalau takut try preview tapi kalau preview kadang2 tak menunjukkan hasilnya

*edit
-merah tu untuk warna yang disukai..boleh cari dekat SINI
-pink untuk jenis border contohnya kalau tak suka dotted boleh tukar kepada solid,dashed


selamat mencuba!

kredit to:wan hazel