Membuat Gambar Efek Zooming

Selamat Pagi sahabat   Bagaimana kabar hari ini ?

pastinya baik bukan ? kali ini Arndy akan sharing tentang Bagai mana membuat Gambar Efek Zooming 

ada yang pernah lihat contoh dari efek Zooming ini ?

kalau belum silahkan lihat di demo berikut

Klik

 

Jika sudah melihat demonya mari kita menuju cara pembuatannya . ikuti baik-baik ya :

• Masuk ke blogger.com >> Pilih Rancangan >>Edit Html >> centang " Expand Widget Template"
• Kemudian Cari Kode </head>, utuk mempermudah pencarian silahkan tekan F3 atau CTRL + f .
• Jika sudah ketemu letakkan Kode berikut tepat diatas kode <./head> :

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://z33s.googlecode.com/files/BesaR.txt.js">
</script>

note : jika kode yang berwarna merah sudah ada pada template anda , maka cukup copy pastekan kode yang dibwahnya saja.

• Terus Simpan Template.

langkah selanjutnya yaitu memasukkan Efek Zooming Pada Gambar . coba lihat baik-baik kode berikut :

<img class="magnify"magnifyby="3" style="width: 200px; height: 250px;" src="Url gambar sobat" alt="" id="BLOGGER_PHOTO_ID_6060538624190533589" border="0" />

• Ganti Tulisan yang berwarna merah dengan Url gambar anda. anda bisa upload di Photobucket
• untuk mengatur tinggi dan lebar gambar silahkan rubah angka pada tulisan yang berwarna Hijau.
• Untuk penempatannya sobat bisa letakkan dipostingan atau di sidebar dan ditempat yang anda suka.

Selamat mencoba. terimakasih sudah berkunjung....

Sumber