Tutorial : Round Hover With Shadow

Assalamualaikum semua....

Arini nak wat tutor psal Round Hover With Shadow...Maknenye..klu cursor korng klik kat picture or link...die akan jadi bentuk oval...syiokk kan??so jom la rami2 wat....

Hah..klik kat pic tuh...tu la bnde alah tutor neh....:)

1. Log in > Dashboard > Design > Edit Html > Tick Expand Widget Templates

2. Tekan F3 atau Ctrl+F search kod kat bawah ini :

/* Header

3. Dah jumpa ?Oke . paste kod ini pula kat ATAS kod yg korang cari tadi tu ok ?:)

/*------ 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;

}

**Tukar kod colour pink mengikut color yang korang suka ok ? :)

4. Da siap . SAVE !

Credit to Lysssasecret