Memperbesar Gambar dengan Magnify Script

Kucoba.com - Memperbesar Gambar Dengan Magnify Script. atau saya sebut dengan memperbesar gambar dengan mengklik image. Biasanya saat pengunjung ingin melihat detail gambar maka mereka akan mengklik gambar, namun apa yang terjadi? mereka marah di arahkan ke halaman baru dan saat ingin kembali ke blog harus menunggu loading lagi, masih mending jika loading blog tersebut cepat kurang dari 5 detik, namun apabila loading blog tersebut berat??? kang salman rasa blog anda akan di tinggalkan pengunjung saat itu juga.

Jika anda mengalami hal yang kang salman ilustrasikan di atas maka anda berada di tempat yang benar saat ini karena posting hari ini saya akan membahas permainan animasi pada gambar, yang mana dengan trik ini saat gambar di klik maka akan  membersar secara otomatis tanpa harus beralih ke halaman baru.
Demo :

Klik gambarnya !.
Contoh dengan mengunakan script Magnify seperti ini :

  

Contoh dibawah ini tanpa mengunakan script Magnify :

 

Bagaimana? bagus bukan!

Cara membuatnya seperti ini :

Login ke Blogger » Dari Dashboard » Design » Edit HTML.

Langkah pertama » Penempatan URL JavaScript
Simpan kode berikut tepat dibawah ]]></b:skin> atau tepat diatas </head>
contohnya:
]]></b:skin>
.............
</head> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script><script type="text/javascript" src="http://pagenano.googlecode.com/files/Gambar%20Magnify.js"></script>

URL yang berwarna merah jika sudah ada, tidak perlu lagi !.

Langkah kedua » Menggunakan fungsi magnifty pada gambar

didalam tag <img>

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBh3crIvkapgwfktYewgUTZb3vDb2tqid-Z0KVNblBPy1IIKuTuWHdvyCgMee5vtrymR25HvCSBMIwfi-8sTiu8WVv9qMOJORuBtYxTcvTtEtQ0TGiC5HbFm9uXiaAzE7yw3bZ7S0EzrkO/s1600/gambar2-Nano+Yulianto.jpg" class="magnify" data-magnifyby="2.5" data-magnifyduration="1000" />

class="magnify" » Ini adalah eksekusi scriptnya.

data-magnifyby="2.5" » Ini untuk mengatur lebar atau bila di tulis 
data-magnifyto="900" » Hasilnya sama akan Mengatur lebar dengan pixel. pilih salah satu saja dari yg warna hijau 

data-magnifyduration="1000" » Durasi saat menjadi besar.

Credit : Dynamic Drive

Penting!
Langkah kedua harus di tulisan secara manual oleh kita.

Nah sobat informasi maya demikian trik memperbesar gambar dengan magnify script, mudah-mudahan dapat di manfaatkan sebagaimana mestinya.. sampai jumpa lagi besok pagi dengan artikel yang tidak kalah baiknya dari ini.

Jangan asl copy paste! baca aturannya disini
Post By Kang Salman
www.kucoba.com

Ingin mendapat penghasilan tambahan? Cara kerja mudah hanya dengan melakukan survey dan mengisi angket lalu anda akan di bayar. Itulah pekerjaan anda disini <= klik untuk daftar dan memanen uang $ seperti saya. Gratis

Dapatkan update artikel  terbaru kami langsung ke email anda.