Gambar Dengan Efek Zooming Diblogger

Hi, sobat blogger diseluruh penjuru dunia, kali ini aku mau sharing sedikit pengetahuan yang aku dapat dari dynamicdrive.com. Menurut aku trik ini sangat menarik buat kamu yang suka posting gambar, karena ketika posting gambar kita bisa menghemat space sebab gambar-gambar tersebut akan kita tampilkan dalam ukuran thumbnail ketika di klik thumbnail tersebut akan di perbesar sesuai dengan demensi yang kita inginkan... Check it OUT silahkan klik gambarnya !!



Tutorialnya ini Sob:

1.Log in Ke Blog Kamu
2.Masuk ke menu design
3.Edit html
Copy script ini
<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://sites.google.com/site/fansnimbuzz/myblog/jquery.magnifier.js">/************************************************ jQuery Image Magnify- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)* This notice MUST stay intact for legal use* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more***********************************************/</script>

Lalu paste dibawah kode ini:
]]></b:skin>
Kemudian silahkan simpan templatenya.

Nah untuk mengeksekusi script tersebut setiap akan memosting image atau gambar, gunakan CSS berikut ini:
<img src="Link gambar.jpg" class="magnify" style="width:200px; height:150px" /><img src="Link gambar.jpg" class="magnify" border="0" />
Untuk dimensi zoomnya bisa disesuaikan dengan keinginan kita. Tinggal kita ganti saja Width:200px; dan height:150px " dengan dimensi yang diinginkan .
selamat mencoba.
Jangan Lupa kasi jempol yaaa :D

Dengan memasukan alamat email dibawah ini, berarti anda akan dapat kiriman artikel terbaru dari iaenblog.blogspot.com di inbox anda: