Tutorial - Blur Image

Ok, ada yang ngerti maksud dari judul tutorial pertamaku ini? Hmm...kalo ga tau, secara singkatnya aja deh aku jelasin. Intinya,

kalo misalnya kamu click atau gulirkan cursor kamu di sebuah image blog, image itu bakal blur. Pas kamu lepasin cursornya, imagenya kembali kayak semula.

Paham, kan? Penasaran? Cekidot...

Pertama, seperti biasa...

Dashboard > Design > Edit HTML

Then, kamu click kode 'Ctrl' plus 'F' secara barengan. Serentak. Terus, search kode di bawah ini,

a:visited {

Ketemu? Kalo ga ketemu, kamu tulis aja kodenya sendiri. Terus, kamu copy di bawah ini,

 -webkit-transition:1s;
transition:1s;
filter:alpha(opacity=100);
-moz-opacity:1.0;
opacity:1.0;
border-radius:5px
}
img:hover {
-webkit-transition:1s;
transition:0.5s;
filter:alpha(opacity= 70);
-moz-opacity:0.70;
opacity:0.70;
}

Kalo udah, kamu paste persis di bawah kode a:visited { tadi.
Bentuknya bakal kayak gini,

Nah, save template kamu. Try buat click image blog kamu. Good luck, hoho...