Minggu, 15 April 2012

Cara Membuat Gambar Membesar Bila Dilalui Cursor



Posting kali ini menanggapi pertanyaan reader blog saya, saya hanya akan menjelaskan bagaimana membuat gambar di blog kita bisa membesar bila di lalui kursor dan mengecil ke ukuran semula setelah kursor tidak di atas gambar. Contohnya seperti  gambar di bawah
.
Caranya pertama kamu masuk ke editor HTML blogger, kalau tampilan blogger kamu baru, mungkin kamu tidak akan menemukan editor HTML, caranya kamu buka url ini http://draft.blogger.com/html?blogID=(nomor ID blogger kamu) dan id blog di isi dengan id blog yang akan kamu beri efek hover di gambar atau bisa juga masuk ke template designer tutorialnya bisa kamu lihat di sini.


Kalau sudah masuk kamu cari kode ]]></b:skin> kalau sudah ketemu, letakkan kode berikut tepat sebelum atau di atas kode ]]></b:skin> :


.hovergallery img{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-o-transform:scale(0.8);-webkit-transition-duration:0.5s;-moz-transition-duration:0.5s;-o-transition-duration:0.5s;opacity:0.7;margin:0 10px 5px 0}.hovergallery img:hover{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);box-shadow:0px 0px 30px gray;-webkit-box-shadow:0px 0px 30px gray;-moz-box-shadow:0px 0px 30px gray;opacity:1}

Lalu Simpan Dan Lihat Hasilnya

0 komentar:

Posting Komentar

Blog Gw © 2008 Template by:
SkinCorner