Setelah sebelumnya saya memposting cara memasang tombol follow dan dashboard di blog, kali ini saya akan memposting tentang Cara Membuat Efek Zoom pada Gambar di Blog. Dengan menggunakan efek ini, setiap gambar yang ada dalam postingan akan tampil dengan pilihan Zoom seperti yang terlihat pada gambar berikut.
Selain itu, cara ini juga bisa di gunakan untuk gambar yang berada di luar postingan seperti di sidebar, header, footer atau bagian lain dari halaman blog.
Sobat yang tertarik untuk membuat efek zoom pada gambar di blog, silahkan ikuti tutorial berikut.
1. Log in ke akun blog sobat.
2. Klik Rancangan --> Elemen Laman --> Tambah Gadget --> Pilih HTML/Javascript
3. Masukkan kode berikut ke dalam kotak.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script src="
http://www.yourjavascript.com/610310434009/unwanted86.blogspot.com.js" type="text/javascript">
/***********************************************
* Kod telah di'edit' oleh unwanted
* Pastikan notis ini tidak dibuang untuk menghargai kerja² edit yang dilakukan oleh unwanted
* -- Sharing Is Caring -- http://www.unwanted86.blogspot.com --
***********************************************/
</script>
<script src="
http://www.yourjavascript.com/610310434009/unwanted86.blogspot.com.js" type="text/javascript">
/***********************************************
* Kod telah di'edit' oleh unwanted
* Pastikan notis ini tidak dibuang untuk menghargai kerja² edit yang dilakukan oleh unwanted
* -- Sharing Is Caring -- http://www.unwanted86.blogspot.com --
***********************************************/
</script>
4. Klik Save.. nah sekarang saatnya di terapkan pada gambar.
Untuk menggunakan efek ini pada gambar di artikel, silahkan gunakan kode pemanggil berikut
<img src="url gambar disini" class="magnify" data-magnifyby="2" style="width:200px; height:150px cursor: url(magnify.cur), -moz-zoom-in; " />
Keterangan :
- Ganti kode berwarna biru dengan Url Gambar Sobat
- Ubah Lebar dan tinggi ( Width - Height ) sesuai keinginan.
- Angka 2 pada kode adalah Skala Pembesaran. Nilai lebih besar dari 1 akan membesarkan gambar dan nilai kurang dari 1 akan mengecilkan gambar. Contohnya 0.5
dan untuk memasukkannya di sidebar atau di tempat lain selain postingan, silahkan masukkan saja kode tersebut di HTML/Javasript sobat.
Sekian cara memasang efek zoom pada gambar di blog, semoga bisa membantu...
17 comments
Write commentsmantap tutorialnya masbro!!!!
Replyakan ta follow blog ni...
agak ribet ya kalo udah ngomomongin script yang di masukan ke edit html,,sering galat gan,,tapi terima kasih buat tips nya
Replyilmu baru nii,,mksh yaa mas brow
Replypraktis nich tipsnya,berkunjung ke sini makin banyak ilmu yang saya tentang blog
Replymantab gan infonya,,,,
Replymampir gan di blog gw ya,,,,,,
artikel tang bermanfaat banget,,,,,
Replyvisit gan di blog sya ya,,,,
ditunggu,,,,,,
keren gan infonya,,,,
Replymampir ya gan di blog kecil ane,,,,
gagal gan
Replynot working....
Replytak ada kata yang hndk ane ucapkan selain ...makasih banyak atas infonya....
Replyyang otomatis gak bisa sob?
ReplyMakasi Infonya ... pasti saya dofollow
Replysaya coba klik gmbarnya tapi kok gak bisa???
Replythanks kawan atas infonya
Replybisa gak tanpar perlu edit template
ReplyEfek zoom nya keren bro! :)
ReplyGan. kalau yg otomatis g palah pakai nambahin kode ketika meletakkan gambar ada gan?
Replysaya newbie :)
EmoticonEmoticon