Cuppylicious

Owner Stuff Entry

Tutorial : Cara buat efek zoom pada image dalam post - Efek 3 (clear image)
Khamis, 17 Mei 2012 | 12:41 PG | 0 budak suka cupcake + pink
Apabila mouse over, gambar tersebut akan auto zoom in dan zoom out. Berbeza sedikit dengan efek yang sebelum ini di mana kali ini efek gambar adalah dalam bentuk clear. Ikuti tutorial di bawah untuk mengaplikasikan trick ini pada blog anda:

1) Sign in akaun blogger anda

2) Dashboard > Design > Edit HTML > Tick kotak "Expand Widget Templates"

3) Dengan menggunakan ctrl + F (tekan serentak pada keyboard), cari kod
<head>

4) Kemudian copy dan paste kod di bawah SELEPAS / DI BAWAH kod <head> yang anda cari dalam langkah 3 tadi
<style>
.post img:hover {
-o-transition: all 0.3s;
-moz-transition: all 0.3s;
-webkit-transition: all 0.3s;
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-webkit-transform: scale(1.2); }
</style>

5) Akhir sekali, klik Preview dan jika tiada error, klik Save.

Selamat mencuba! :)





|
Photobucket
Annyeonghaseyo earthlings~ I am an alien. Follow this blog yaw!
So, you can always visit my tutorial~





Edited : Amirra Najihah
Photo : We♥It
Tutorial : Jom Bina Belog
Best Viewed : Google Chrome