Tutorial : Image Hover (Image Melengkung)

Assalamualaikum and annyeonghaseyo. Hai . Dah lama tieqa tak hupdate. Nampak sangat blog ni dah berhabuk + bersarang. Okay la, tuto kali ni direquest oleh adik Anisa . Dia tanya macam mana nak buat gambar melengkung bila cursor menyentuh. Oh btw bagi yang ada request dekat formspring, kalau tieqa tak buat tuto yang korang request tu, bermakna rienna dah pernah buat tutonya sebelum ni. Okay lah, jom start.

Tuto ni hanya untuk pengguna Template Designer sahaja
1. Dashboard > Design > Edit HTML > Tick Expand Widget Templates
2. Press Ctrl + f serentak dan cari code

/* Header
----------------------------------------------- */

3. Kemudian, copy code dekat bawah ni

 img {
border-radius:10px;
opacity:0.6;
-webkit-transition-duration:2.5s;
}
img:hover{
border-radius:30px;
opacity:10.8;
-webkit-transition-duration:2.5s;
}

4. Paste di bawah code tadi
5. Preview & save

Untuk template classic boleh rujuk dekat SINI