Tutorial : Rounded Image Hover Effect

Huiihuii..korang buat pe tuh? tetibe rase rajin pulak nie nak menghupdate belog..story mory later ukeyh..nak share tutorial jep untuk korang..suke? tak suke? HAHA..wutever meh..worait,so kali nie nak buat tutorial besh punyer..Tutorial Rounded Image Hover Effect..yang camne tuh? korang pernah masuk sesetengah belog yang apply tutorial nieh,means kalao korang sentuh cursor dekat gambar..then jadi cam rounded effect tuh..ta paham?tengok gambar kat bawah nie ye..#sorry sebab Yana tak apply dalam blog nieh
 

1) Log In>> Dashboard>> Design>> Edit HTML

2) Tick Expand Widget Template

3) tekan "ctrl+F" dan cari code kat bawah nie kayh

/* Header

4) Bila dh jumpe,then copy paste code kat bawah nie ATAS code tadi tau

/*------ 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 #FF3366; -moz-box-shadow: 0px 0px 20px #FF3366; -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#FF3366; 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;
}

5) Tukar code yang dihiglight pink tu ekot warna kesukaan korang ye

6) SAVE,dah ciap dahh~~

---

Suka? LIKE je! :)

---

---

LIKE Fan Page Yana sekali yer! :)

---