Kamis, 19 April 2012

Membuat Cloud Zoom Untuk Blogger


Cloud Zoom adalah ringan, sangat disesuaikan jQuery plugin yang memungkinkan Anda untuk menambahkan zooming gambar dalam halaman web Anda. Anda dapat menggunakan plugin ini untuk membuat gambar dapat diubah tampilan dengan berbagai fitur, seperti efek warna, zoom dalam dan fokus lembut. Ini adalah plugin browser lintas yang bekerja di semua web browser utama termasuk IE6.

Zoom Cloud sangat mudah untuk menerapkan dan sangat baik didokumentasikan. Anda dapat dengan mudah menyesuaikan tampilan jendela gambar, lensa dan zoom lebih kecil menggunakan CSS. Menawarkan beberapa pilihan konfigurasi yang memungkinkan Anda untuk menyesuaikan perilakunya termasuk: tinggi, lebar & posisi jendela zoom; warna; opacity; jumlah kelancaran / drift gambar zoom ketika bergerak; mengaktifkan atau menonaktifkan judul.
    

Langkah Tambahkan ke Blogger:




1.Login ke akun Blogger.

2. Sekarang Pergi ke Desain> Edit HTML.

3. Sekarang mencari tag </ head> dan paste kode berikut hanya atas / Sebelum itu.
 
<link href="http://dl.dropbox.com/u/27675057/Cloud%20Zoom/cloud-zoom.css" rel="stylesheet" type="text/css" />   
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="http://dl.dropbox.com/u/27675057/Cloud%20Zoom/cloud-zoom.1.0.2.js" type="text/JavaScript">
</script>
4 . Cara Memasukkan gambar ke posting dan berefek cloud zoom anda harus memakai kode dibawah ini :
<a class="cloud-zoom" href="Image.Jpg" id="zoom1" rel="adjustX: 10, adjustY:-4, softFocus:true"> 
<a class="cloud-zoom-gallery" href="Image.Jpg" rel="useZoom: 'zoom1', smallImage: 'Image.Jpg' " title="Thumbnail 1">

&nbsp;<img alt="Thumbnail 1" src="Image.Jpg" /></a>&nbsp;<a class="cloud-zoom-gallery" href="Image.Jpg" rel="useZoom: 'zoom1', smallImage: 'Image.Jpg' " title="Thumbnail 2"><img alt="Thumbnail 2" src="Image.Jpg" /></a>&nbsp;<a class="cloud-zoom-gallery" href="Image.Jpg" rel="useZoom: 'zoom1', smallImage: 'Image.Jpg' " title="Thumbnail 3"><img alt="Thumbnail 3" src="Image.Jpg" /></a>
Keterangan :
  • Yang Teks Image.Jpg bisa anda ganti dengan Image anda sendiri / sesuai keinginan anda 
5. Langkah terakhir kalian Save / Terbitkan lalu liat efek nya :D
Semoga Bermanfaat
Description: Membuat Cloud Zoom Untuk Blogger
Rating: 4.5 4.5
Share on :
 
© Copyright Top Online News | Toko News 2011 - Some rights reserved | Powered by | Blogger.com.
Template Design by Herdiansyah Hamzah | Supported by Toko Blog N GoogleMembuat Cloud Zoom Untuk Blogger