Tutorial : Image Hover 10 (Kabur)

Assalamualaikum . Tutorial kali ni , bila korang halakan cursor ke gambar . Gambar tu akan menjadi kabur . Pada mulanya dia terang lah . Faham kan ? Okay jum buat tutorial ni . 

Blogskin/Classic Template

1. Dashboard > Template

2. Press F3 dan cari code </style>

3. Copy code di bawah ni 

 img{ opacity: .70; -webkit-transition: 1.4s;  -moz-transition: 1.4s; border-radius:10px;}
img:hover{ border-radius:30px; -webkit-transition: 1.4s;  -moz-transition: 1.4s; opacity: 100.0; }

4. Paste code di atas code yang korang cari tadi

5. Preview & save

Template Designer

1. Dashboard > Layout > Add a gadget > HTML/Javascript

2. Copy code kat bawah ni

<style> /* ----- Image opacity effect 1 ----- */ .post a img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; -khtml-opacity: 1.0; } .post a:hover img { filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; -khtml-opacity: 0.5; } </style>

3. Paste dalam ruangan HTML tadi

4. Preview & save

Credit to : AtinTory