Cara Membuat Efek Zoom Pada Image / Gambar

Sudah 2 minggu ini aku ud lama g posting tentang efek blog, kali ini aku mau sedikit menulis bagaimana cara membuat suatu effect pada gambar atau image yang kita pasang yaitu effect yang membuat besar image / gambar ketika mouse diletakkan tepat di atasnya / di sorot. Banyak sekali web yang menggunakan aplikasi effect seperti ini, biasanya web yang menampilkan galeri gambar.

Untuk lebih jelasnya silakan liat contoh image dibawah ini dan letakkan kursor tepat pada image :


Cara membuatnya adalah :
1. Login ke Account blogger sobat.
2. Pilih Tata Letak => Edit HTML.
3. Carilah kode </head>, lalu tambahkan script berikut di atas kode </head>.

<style type='text/css'>
border: none;
vertical-align: top;
}
</style>
<script src='http://www.hotlinkfiles.com/files/2788517_sfjm6/seby-antoe_zooming_image.js' type='text/javascript'>

/* http://www.seby-antoe.com (c) Script 2009 Boleh Di Pasang di Tutorial Blog Lain Asal Menyertakan link Ini*/

</script>

4. Klik tombol Simpan dan selesai

Untuk cara pemasangan script pada image / gambar, sisipkan kode di bawah ini :

<img class="expando" border="0" src="URL Image / Gambar kamu" width="100" height="100">

Silahkan masukkan URL Image / gambar kamu pada keterangan yang berwarna merah diatas.

Mudah bukan ... silahkan dipraktekkan dan semoga berhasil. Tampilan image / gambar kamu akan terlihat lebih keren dan menarik dengan effect ini.
Happy Blogging ...


Sumber : http://www.seby-antoe.com/2009/09/membuat-efek-zoom-pada-image-gambar.html

Share