2
Komen

Kesan Khas Pada Gambar Apabila Dilalukan Cursor

Satu kemestian bagi sesebuah blog mempunyai gambar di dalamnya. Tidak kira dalam entri atau di bahagian lain. Dan lebih menarik jika gambar yang anda letakkan memberikan sedikit kesan khas apabila anda lalukan cursor padanya.







Tutorial untuk membuat kesan khas pada gambar ini adalah seperti berikut.


1. Dari dashboard > design > edit html
(backup template untuk langkah berjaga²)

2. Dengan menggunakan fungsi find (ctrl + F), cari kod a img {

3. Delete kod selepas a img {, dan gantikan kod di bawah.


-webkit-transition-duration:.4s;}

img:hover {filter: alpha(opacity=60);
opacity: .6;
border-radius:20px;
border: 1px #FF66CC;
-webkit-box-shadow: 0px 0px 20px #FF66CC;
-moz-box-shadow: 0px 0px 20px #FF66CC;
}



Contoh:
Sebelum



Selepas


4. Save dan lihat hasilnya..:)

UPDATE:
Bagi yang tidak jumpa kod a img {,
copy kod di bawah, dan paste SEBELUM /* Headings atau /* Header


a img {
-webkit-transition-duration:.4s;}
img:hover {filter: alpha(opacity=60);
opacity: .6;
border-radius:20px;
border: 1px #FF66CC;
-webkit-box-shadow: 0px 0px 20px #FF66CC;
-moz-box-shadow: 0px 0px 20px #FF66CC;
}

SUKA??? LIKE,TWEET AND G+ :)

2 00 dh komen korong bla lg nk komen:

KiMiE said...

Wah..best nih..bleh la try..huhu!!

PU3 said...

wahh..wahh..semangat berapi nek jah ni..hihih
pak joe nti singgah cni ..
http://lobaksusue.blogspot.com
kita tag u tau ..hihihi