Tutorial Rounded Image Hover Effect

wallah! tuto ke tiga hari ni! aku nak melangsaikan hutang tuto aku yg dulu duluuuu tu.. heheh. rounded image hover effect ni macamm kalau korang hover gambar kat blog orang tuu, hujung dia jadi cam bulat.. ahhh sapa yg tak tau pegi main jauh jauh! *joking! jangan amik ati okay? tanya kat komen lah :)

1) Design > Edit HTML

2) CTRL+F atau F3 and search code ni

a img{

3) Copy and paste code ni dekat bawah code tadi

-webkit-transition-duration:.4s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px40px #ffffff; -moz-box-shadow: 0px 0px 40px #ffffff; -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: 0px dashed #000000;border-radius: 40px; -moz-border-radius: 40px;}

merah: lebar shadow dia

oren: warna shadow dia. boleh rujuk SINI

ungu: ketebalan border gambar

hijau: warna border gambar

biru: kelengkungan border

itu ajelah! semoga berjaya! :)

creds: apit comel