" F l o w e r "

flaw

Hai Welcome Here


" Welcome to my bittersweet diary "

We can chatting here

<>




Tutorial Image Rounded Hover (Coloured)}
Thursday, August 18, 2011 | 10:27 PM | 3Comment


Salam. Lama kan x buat tuto? Kali ni Twill akan ajar camna nak buat rounded image hover. Kalau korang halakan cursor kat mana2 gambar, akan ada bentuk bulat warna pink kan? Senang je nak watnya..
1. Mula2, klik Dashboard > Design > Edit HTML

2. Cari kod ni 
/* Header
 
3. Copy code bawah ni kat ATAS  /*Header
 
 /*------ 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 #DF7401;
padding: 0px;
}
 
4. Kalau nak ubah warna klik ni-> LEMBAH RAHSIA

5. Savekan..


~ Kalau jadi bagitau tau?