Efek Zoom Gambar di Blog

terkadang saat kita menggunjungi sebuah situs atau blog para profesional kita akan terperangah dan ada kalanya tertarik dengan apa yang tersaji disana. nah kali ini KIM CITRA TARUNA KENANGA akan sedikit membagi trik untuk membuat efek gambar zoom out pada blog dengan menggunakan CSS.

berikut contohnya.

alasan kenapa KIM Citra Taruna Kenanga menggunakan CSS adalah karena disamping ringan juga paling mudah ketimbang menggunakan metode lain.

oke, tidak perlu berpanjang lebar, berikut caranya :

1. login ke blog anda.
2. masuk ke desain / template.
3. cadangkan dulu template yang sudah anda buat. untuk mencadangkan template akan kami ulas pada post berikutnya
4. masuk ke edit html
5. copy kode berikut diatas }]]></bskin> atau sejenisnya

             .post 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 2px 2px 0;
             }
             .post img:hover{
             -webkit-transform:scale(1.1);
             -moz-transform:scale(1.1);
             -o-transform:scale(1.1);
             opacity: 1;
             }
        6. simpan tempalte anda dan liat perbedaannya.

catatan : 

1. angka biru bisa anda sesuaikan sendiri, angka < 1 maka gambar anda akan di kecilkan, sedangkan yang saya pakai untuk blog ini yaitu : 1 kalau untuk on hover (mouse diatas image/gambar) beri nilai > 1 sesuaikan dengan lebar design blog anda.
2. angka merah untuk opacity, fungsi ini untuk memudarkan gambar anda, saran saya ganti angka merah dengan 1 agar gambar anda tidak berubah memudar seperti yang kami pakai (angka < 1 akan membuat gambar anda berwarna kabur keputihan sedangkan > 1 akan mengaburkan bahkan bila anda memasukkan angka 2 maka gambar anda akan hilang ^_* )
3. sesuiakan semua sesuai keinginan anda. 

demikian langkah untuk membuat  efek zoom pada gambar semoga membantu dan terakhir KIM CITRA TARUNA KENANGA mengucapkan selamat mencoba.