SCRIPT ZOOM GAMBAR - CLOUD ZOOM - JQUERY - CATATAN HAYDAR ALI

Teknologi

More on this category »
Home » , » SCRIPT ZOOM GAMBAR - CLOUD ZOOM - JQUERY

SCRIPT ZOOM GAMBAR - CLOUD ZOOM - JQUERY



1. Log In Blog - Rancangan - Edit HTML
2. Cari kode </head> pada rancangan html anda.
3. Copy paste script di bawah di atas kode </head> kemudian simpan

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
<script src='http://suyb.googlecode.com/files/cloud-zoom.1.0.2.js' type='text/javascript'/>

4. Edit HTML Entry kamu seperti contoh dibawah ini.

<a class="cloud-zoom" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6ZrfOlGd5IWxobGHzydVP-CeZI7HS5O_9m29hBVw2D6gvWxMgromkw0NaKVgWrSf-QcAGvz24aqHItjjfb2zirfk2XrHXX0jkEhEYLSpeseWbQti432zm_Y7dcDvzHvmGeYD0vZ7DsaP9/s1600/sakura-naruto-sasuke-akatsuki-naruto-shippuuden-452719_1280_1024.jpg" rel="softFocus: true, position:'inside', smoothMove:2"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI3B0Y0rXj6TZXVY9Qf0tEz_g1Z3A95rKEhKFr42UpjbsU_oGAl-8ZSu1qd4nDFfFHowNvOO7qwy3G1UT_7H7_0qlIvRsCQUGyY3dP4wrCnq2Qmvhi37JUVGDqStu85f3PWp8XR1fAZg_T/s640/sakura-naruto-sasuke-akatsuki-naruto-shippuuden-452719_1280_1024.jpg" /></a>

NB : Setelah kamu upload gambar, dan siap untuk di terbitkan. Klik Edit HTML dan modifikasi html postingan kamu seperti HTML di atas.
Warna biru adalah kode html agar gambar bisa di zoom.  
Warna merah adalah kode html untuk memanggil gambar.  
Warna hitam adalah ukuran gambar  besar dan gambar kecil.

DEMO SCRIPT ZOOM
ENJOY YOUR BLOG BY HAYDAR ALI

UPDATE : 10 Jan 2012
Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Creating Website
 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. CATATAN HAYDAR ALI - All Rights Reserved
Template Modify by Creating Website
Proudly powered by Blogger