tutor- effect kat gambar bile cursor sentuh

agak panjang tajuk tutor nih..paham,tak..?dalam bahasa ringkasnye, bile cursor korang sentuh kat gambar korang, de,akan ade side effect..and, sudah menjadi satu kewajipan..dalam blog mesti ade gamba untuk menambahkan lagi kemenarikan apabile membacanye,kan..
so, jom kite blaja sesame..

1. dashboard> design>edit html
(sile backup template asal sebagai langkah bejage2)

2. tekan ctrl+F secara serentak untuk cari kod a img {

3. da jupe..?sile delete kod a img { dan gantikan dengan kod dibawah nih


-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.kalau nak slamat, preview dlu, pastu baru save..

*bg yg tak jupe kod a img { copy kod kat no 3 n paste sebelum /*headings atau /*header..die akan jadi seperti ini:


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;
}


semoga bejaye..!!
sile like..

Photobucket

0 budak merepek:

Post a Comment