Cara Membuat Slideshow Dengan Jquery Cycle Plug In

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

bismillaahirrahmaanirrahiim

السَّلاَمُ عَلَيْكُمْ وَرَحْمَةُ اللهِ وَبَرَكَاتُهُ

Assalamu'alaikum warahmatullahi wabarakatuh

jQuery Cycle Plugin adalah sebuah Slideshow Plug In yang ringan dan cukup mengagumkan. Plugin ini menyediakan sebuah metode pemanggilan cycle yang di libatkan pada sebuah element container,yang mana tiap-tiap bagian element dari container menjadi sebuah slide. Jika sobat tertarik menggunakan jquery slideshow dengan cycle plugin untuk blogger khususnya atau website sobat ikutilah langkah-langkah di bawah ini

1. Seperti biasa sobat harus log in dulu ke blogger
   
2. Pilih Rancangan
   
3. Kemudian pilih Edit HTML
   
4. centang Expand Widget Templates dan backup dulu templete sobat (untuk menghindari apabila terjadi kesalahan)
   
5. Copy code dibawah ini dan pastekan diatas code </head> atau di bawah code ]]></b:skin>
   
   
   

   <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"> </script>
   <script type="text/javascript" src="http://my-slideshow.googlecode.com/files/jquery.cycle.all.min.js"> </script>
   <script type="text/javascript">
   $(document).ready(function(){
   $('#myslides').cycle({
   fx: 'cover',
   speed: 500,
   timeout: 2000
   });
   });
   </script>

   
   
   
   
6. Untuk code CSS di bawah ini sobat copy dan pastekan diatas kode ini ]]></b:skin>
   
   

   #myslides {
   width: 370px;
   height: 220px;
   padding: 0;
   margin: 0 auto;
   }
   
   #myslides img {
   padding: 10px;
   border: 1px solid rgb(100,100,100);
   background-color: rgb(230,230,230);
   width: 350px;
   height: 200px;
   top: 0;
   left: 0
   }

   
   
   
   PERHATIAN
   Sobat bisa mengedit kode css diatas sesuai dengan yang sobat inginkan misalnya width (lebar slidshow/gambar) dan height (tinggi slideshow/gambar)
   
   
   
   
7. Langkah yang terakhir adalah sobat memasang kode HTML di bawah ini dimana sobat ingin meletakkan SlidShow tersebut dengan mendambah Gadget.

<div id="myslides">
<img src="http://my-slideshow.googlecode.com/files/cilimus.jpeg.jpg" />
<img src="http://my-slideshow.googlecode.com/files/air-panas.jpg" />
<img src="http://my-slideshow.googlecode.com/files/gunung-ciremai.jpg" />
<img src="http://my-slideshow.googlecode.com/files/telaga-remis.jpg" />
<img src="http://my-slideshow.googlecode.com/files/kolamlinggarjati.jpg" />
</div>

PERHATIAN
kode yang berwarna kuning adalah alamat Gambar. Silahkan sobat ganti dengan alamat gambar sobat.

KOMENTAR ANDA SANGAT BERMANFAAT BAGI PERKEMBANGAN BLOG INI
Update Contact :
No Wa/Telepon (puat) : 085267792168
No Wa/Telepon (fajar) : 085369237896
Email : Fajarudinsidik@gmail.com NB :: Bila Sobat tertarik Ingin membuat software, membeli software, membeli source code, membeli hardware elektronika untuk kepentingan Perusahaan maupun Tugas Akhir (TA/SKRIPSI), Insyaallah Saya siap membantu, untuk Respon Cepat dapat menghubungi kami, melalui :

No Wa/Telepon (puat) : 085267792168
No Wa/Telepon (fajar) : 085369237896
Email: Fajarudinsidik@gmail.com

atau Kirimkan Private messanger melalui email dengan klik tombol order dibawah ini :

ٱلْحَمْدُ لِلَّهِ رَبِّ ٱلْعَٰلَمِين

Alhamdulilah hirobil alamin

وَ السَّلاَمُ عَلَيْكُمْ وَرَحْمَةُ اللهِ وَبَرَكَاتُهُ

wassalamualaikum warahmatullahi wabarakatuh

Artikel Cara Membuat Slideshow Dengan Jquery Cycle Plug In, Diterbitkan oleh scodeaplikasi pada Senin, 23 Mei 2011. Semoga artikel ini dapat menambah wawasan Anda. Website ini dipost dari beberapa sumber, bisa cek disini sumber, Sobat diperbolehkan mengcopy paste / menyebar luaskan artikel ini, karena segala yang dipost di public adalah milik public. Bila Sobat tertarik Ingin membuat software, membeli software, membeli source code ,Dengan Cara menghubungi saya Ke Email: Fajarudinsidik@gmail.com, atau No Hp/WA : (fajar) : 085369237896, (puat) : 085267792168.