Cara membuat efek zoom pada gambar pada kesempatan kali ini saya akan mengulas kembali tentang membuat efek zoom gambar yang mana cara ini hanya untuk mempecantik tampilan blog, dimana cara kerja dari efek ini yakni apabila pointer mouse berada diatas gambar maka akan membesar tampilannya atau men-zoom menjadi ukuran sebenarnya.
Jika ingin melihat hasilnya coba anda sorot baner yang ada di sebelah ( sidebar ), nantinya akan menjadi seperti itu.
Berikut adalah cara membuatnya.
Jika ingin mengatur ukuran gambarnya sebelum pointer mouse melintas diatasnya (gambar default tampilan) tinggal menambahkan kode height="nilai-tinggi" weight="nilai-lebar"Dan nantinya akan menjadi seperti berikut<img src="http://link-gambar-kamu.jpg" height="nilai-tinggi" weight="nilai-lebar" class="zoom"/>
Jika ingin melihat hasilnya coba anda sorot baner yang ada di sebelah ( sidebar ), nantinya akan menjadi seperti itu.
Berikut adalah cara membuatnya.
- login ke blogger anda.
- pilih Rancangan »» Edit HTML , Jangan lupa untuk beckup template terlebih dahulu.
- Centang Expand Template Widget.
- Tempatkan kode berikut diatas kode ]]></b:skin>
.zoom:hover {-moz-transform:scale(1.25); -webkit-transform:scale(1.25); }
- terakhir klik SIMPAN
Jika ingin mengatur ukuran gambarnya sebelum pointer mouse melintas diatasnya (gambar default tampilan) tinggal menambahkan kode height="nilai-tinggi" weight="nilai-lebar"Dan nantinya akan menjadi seperti berikut<img src="http://link-gambar-kamu.jpg" height="nilai-tinggi" weight="nilai-lebar" class="zoom"/>
Demikian Cara Membuat Efek ZOOM pada Gambar di Blog, mudah bukan?
Semoga bermanfaat.
