42.Tutorial Plugin jQuery Image dan Slider

Tutorial Plugin jQuery Image dan Sliders
CSSTuts+ - Dalam Artikel ini, Anda akan menemukan yang terbaik dari jQuery images dan Sliders Plugin sehingga Anda dapat mengambil keuntungan dari mereka dan menghasilkan gambar yang mengejutkan dan slider konten. Anda mungkin merasa cukup sulit untuk mencari tahu yang Plugin yang terbaik bagi Anda karena semua plugin ini memiliki fungsi yang berbeda. Mari kita lihat lebih dekat!

1. FlexSlider

( Demo | Download )
FlexSlider adalah hal yang menakjubkan benar-benar responsif jQuery Plugin slider. Ini tidak rumit, markup slide, semantik dan animasi fade, dan didukung di semua browser utama, karena itu Anda tidak akan memiliki masalah kompatibilitas. Flexslider dibangun untuk pemula dan pro dengan cara yang sama.
jquerysliders8 tutorials photo effects

2. Bubble Slideshow Effect with jQuery

( Demo | Download )
Dalam tutorial ini kita akan membangun efek jQuery animasi buble. Ini akan menjadi cara yang bagus untuk menyajikan satu set gambar pada website Anda sebagai tayangan slide menarik, dan karena kode tersebut akan benar-benar modular, Anda akan dapat dengan mudah menggunakannya dan memodifikasinya.
Bubble Slideshow Effect with jQuery

3. Responsive Image Gallery with Thumbnail Carousel

( Demo | Download )
Dengan plugin ini Anda dapat membuat galeri foto responsif dengan thumbnail korsel menggunakan Elastislide. Galeri ini akan memiliki tombol pandangan yang memungkinkan orang untuk melihatnya dengan atau tanpa korsel thumbnail. Kami juga akan menambah kemungkinan untuk menavigasi dengan keyboard.
Responsive Image Gallery with Thumbnail Carousel

4. Circular Content Carousel with jQuery

( Demo | Download )
Dengan korsel konten melingkar, Anda dapat memiliki beberapa konten kotak yang bisa digeser secara substansial (melingkar). Mengklik “More” link akan memindahkan item masing-masing ke kiri dan geser ke luar daerah konten, sehingga Anda dapat menavigasi melalui ban berjalan dimana pada setiap tahapan akan mengungkapkan isi kotak berikutnya atau sebelumnya dengan konten diperpanjang.
Circular Content Carousel with jQuery

5. Lateral On-Scroll Sliding with jQuery

( Demo | Download )
Dalam tutorial ini kita akan menunjukkan cara untuk membuat “slide-in pada gulir” efek. Anda mungkin pernah melihat efek dingin di beberapa website, seperti pada Nizo atau di bagian portofolio Moulade La brilian dirancang. Ide utama adalah untuk geser lateral dalam elemen tergantung pada posisi gulir dokumen. Membagi halaman ke sisi kiri dan kanan, kita ingin memindahkan elemen dari “luar” dari halaman ke pusat ketika mereka berada di viewport.
Lateral On-Scroll Sliding with jQuery

6. Scrollbar Visibility with jScrollPane

( Demo | Download )
Terkadang akan sangat berguna untuk menyembunyikan scrollbar elemen dalam sebuah situs web dan hanya tampilkan ketika pengguna benar-benar membutuhkannya. Real-time aktivitas pakan di Facebook adalah contoh untuk seperti perilaku. Dalam tutorial ini kami ingin menunjukkan kepada Anda bagaimana menggunakan JScrollPane dan memperpanjang dengan fungsi untuk menyembunyikan scrollbar dan tunjukkan di hover.
Scrollbar Visibility with jScrollPane

7. Timelinr

( Demo | Download )
Plugin jQuery sederhana akan membantu Anda dalam memberikan kehidupan yang lebih untuk dinyatakan tak bernyawa jadwal Anda. Dengan plugin ini, Anda dapat dengan mudah parameterize mayoritas atribut: kecepatan, transparansi, dll Ini juga mendukung layout horisontal dan vertikal.
Timelinr

8. SmartGallery

( Demo | Download )
SmartGallery adalah plugin yang sangat ringan, keringanan dengan cepat dan benar-benar untuk imagegaleri disesuaikan yang telah dirancang secara khusus untuk mendukung data yang besar. SmartGallery dilengkapi dengan 12 efek transisi yang berbeda bersama dengan beberapa efek transisi yg tak ada bandingannya dan navigasi thumbnail.
SmartGallery

9. Xml Driven Vertical News Scroller Script

( Demo | Download )
vScroller menunjukkan diklasifikasikan dan warna-kode konten adalah gulir tegak atau vertikal. Feed berasal dari file XML teratur dan ditata dengan CSS3 polos untuk antarmuka segar dan tampan.
Xml Driven Vertical News Scroller Script Using html and jQuery vScroller

10. jQuery Sliding Content Bar Plugin: PushUp Content

( Demo | Download )
Ini Baris konten yang cerdas dan cepat mudah untuk mengintegrasikan dalam desain web atau aplikasi berbasis web. Anda mulus dapat mengintegrasikan ini dalam situs web Anda dan itu akan muncul bila diperlukan. Selain itu, sangat mudah untuk menyesuaikan plugin ini. Anda dapat menambahkan kontak Anda rincian, peta lokasi melalui Google Maps, dan formulir kontak polos bahwa pengunjung dapat digunakan untuk membuat kontak dengan Anda.
jQuery Sliding Content Bar Plugin: PushUp Content

11. Skitter

( Demo | Download )
Bergerak dgn cepat adalah plugin untuk memproduksi tampan tampilan slide. Anda dapat mengubah setiap aspek slideshow Anda.
Skitter

12. Diapo

( Demo | Download )
Diapo adalah sumber jQuery plugin gratis dan slideshow terbuka. Yang paling menarik, Anda juga dapat menggunakannya dalam proyek Anda dan menjualnya sebagai bagian dari pekerjaan yang lebih besar (sumbangan yang tidak diperlukan, tetapi diminta untuk dipertimbangkan dalam kasus ini).
Diapo

13. Craftyslide

( Demo | Download )
Craftyslide adalah slideshow kecil yang dibangun pada jQuery dengan maksud untuk menjadi unik dengan perabotan sederhana, tanpa embel-embel proses menampilkan gambar dikemas ke dalam sebuah plugin kecil, bersih dan kompeten.
Craftyslide

14. Responsly.js

( Demo | Download )
Responsly.js adalah band widget responsif sederhana, ditulis dengan cara CSS3 transformasi dan dapat diakses sebagai sebuah plugin jQuery.
Responsly.js

15. Elastislide

( Demo | Download )
Ini adalah satu lagi kuda putar jQuery sangat responsif yang akan menyesuaikan ukuran dan kinerjanya sehingga dapat bekerja pada setiap ukuran layar. Menempatkan dalam struktur korsel ke dalam sebuah wadah dengan lebar cairan akan membuat cairan korsel juga.
Elastislide

16. Blueberry

( Demo | Download )
Yang satu ini merupakan sumber eksperimental jQuery Plugin gambar slider terbuka yang telah dirancang dengan tujuan untuk bekerja dengan cairan / responsif layout web.
Blueberry

17. Slidorion

( Demo | Download )
Slidorion merupakan penggabungan dari sebuah slider gambar dan akordeon, dan karena itu, hal ini menunjukkan gambar menarik bersama-sama dengan deskripsi panjang berubah-ubah. Slidorion merupakan alternatif untuk slider jQuery tradisional melihat bahwa gambar terkait dengan setiap tab dan disertai dengan array besar efek.
Slidorion

18. bxSlider

( Demo | Download )
bxSlider adalah slider konten jQuery HTML dan tayangan slide gambar.
bxSlider

19. Minimit

( Demo | Download )
Minimit Gallery adalah plugin jQuery sangat disesuaikan yang melakukan hampir segalanya: galeri dan slideshow untuk komidi putar dan slide dan hal lainnya yang memiliki multiple states

20. Galleria

( Demo | Download )
Galleria adalah gambar JavaScript galeri kerangka kerja yang telah dibangun di library jQuery. Tujuannya adalah untuk membuat proses menciptakan galeri gambar profesional lebih mudah untuk web dan perangkat mobile.
Galleria

21. jQuery Image Gallery

( Demo | Download )
Ini adalah images jQuery Plugin galeri mudah.
jQuery Image Gallery

22. rlightbox

( Demo | Download )
rlightbox adalah antoher jQuery UI media kotak yang dapat memakai jenis pandangan beberapa konten untuk gambar contoh, YouTube dan Vimeo video. Ini bear fitur tak tertandingi beberapa seperti Panorama dan Live Re-ukuran. Seperti widget jQuery UI, adalah ThemeRoller siap terpasang.
rlightbox

23. jQuery MB Bgnd Gallery

( Demo | Download )
Dengan jQuery plugin Anda dapat membuat slide show sugestif gambar sebagai latar belakang halaman Anda, gambar akan beradaptasi ukurannya dengan ukuran jendela. Anda dapat menavigasi galeri dengan keyboard atau dengan panel kontrol di mana Anda ingin ditampilkan di halaman.
jQuery MB Bgnd Gallery

24. PikaChoose

( Demo | Download )
PikaChoose adalah Slideshow plugin jQuery ringan yang membuat tunjangan untuk presentasi unproblematic foto dengan komidi putar dan lightboxes! Pikachoose dibuat untuk mudah diinstal, bebas masalah untuk setup.
PikaChoose

25. Fluid Thumbnail Bar with jQuery

( Demo | Download )
Dengan plugin ini Anda dapat membuat sebuah bar thumbnail cairan yang halaman melalui gambar yang dikandungnya.
Fluid Thumbnail Bar with jQuery

27. Elastic Image Slideshow with Thumbnail Preview

( Demo | Download )
Di sini kita ingin menunjukkan cara untuk membuat slideshow elastis sederhana dengan preview thumbnail. Slideshow akan menyesuaikan secara otomatis ke wadah sekitarnya dan kami dapat menavigasi melalui slide dengan menggunakan previewer thumbnail atau pilihan slideshow autoplay.
Elastic Image Slideshow with Thumbnail Preview

28. Fullscreen Slideshow with HTML5 Audio and jQuery

( Demo | Download )
Dalam tutorial jQuery kita akan menciptakan tayangan slide foto layar penuh untuk menggambarkan serangkaian York picture. Kami akan menambahkan suara dengan elemen audio yang HTML5 untuk memberikan kehidupan ke galeri dan mencoba untuk menciptakan suasana keindahan kota ini.
Fullscreen Slideshow with HTML5 Audio and jQuery

29. Image Wall with jQuery

( Demo | Download )
Dengan plugin ini Anda dapat membuat gambar dinding rapi dengan jQuery. Idenya adalah untuk menyebarkan beberapa thumbnail dengan ukuran yang berbeda pada halaman dan membuat slide pita di saat kita klik pada gambar. Pita akan menunjukkan beberapa gambaran di sebelah gambar dan ketika mengklik lagi pada thumbnail, pita akan menutup dan membuka lagi dengan versi besar gambar.
Image Wall with jQuery

30. Rotating Image Slider with jQuery

( Demo | Download )
Rotating Image Slider with jQuery

31. Moving Boxes Content with jQuery

( Demo | Download )
Dengan plugin ini Anda dapat membuat sebuah situs web template dengan beberapa animasi sangat manis menggunakan jQuery. Idenya adalah memiliki kotak kecil yang tersebar di seluruh di bagian atas situs dan ketika item menu diklik, kotak bernyawa untuk membentuk area konten utama.
Moving Boxes Content with jQuery

32. Supersized 3.2 – Fullscreen Slideshow jQuery Plugin

( Demo | Download )
Dengan jQuery plugin Anda dapat membuat slideshow layar penuh yang indah.
Supersized 3.2 – Fullscreen Slideshow jQuery Plugin

33. Flip Box

( Demo | Download )
Flip sebuah plugin jQuery yang akan dengan mudah membalik elemen Anda dalam empat arah.
Flip Box

34. Innovation Slide – Slide jquery plugin

( Demo | Download )
Dengan plugin ini Anda dapat membuat sederhana, ringan, slide foto efek-sarat dan sangat fleksibel. Ini akan memungkinkan kita mengalir dalam konten “berbeda” kami: gambar, teks, dll
Innovation Slide - Slide jquery plugin

35. TN3 Gallery

( Demo | Download )
Dengan TN3 Galeri Anda dapat dengan mudah membuat galeri foto menakjubkan dan tayangan slide dengan efek transisi licin, serta beberapa album, CSS menguliti, XML dan dukungan Flickr dengan sejumlah fitur tambahan. Tidak ada browser plugin diperlukan.
TN3 Gallery

36. Shutter Effect Portfolio with jQuery and Canvas

( Demo | Download )
Dalam tutorial jQuery, kita akan menggunakan elemen kanvas HTML5 untuk menciptakan portofolio fotografi sederhana, yang menampilkan fitur Kumpulan foto dengan efek rana kamera. Fungsi ini akan datang dalam bentuk yang mudah untuk menggunakan plugin jQuery yang Anda dapat dengan mudah memasukkan ke dalam situs web apapun.
Shutter Effect Portfolio with jQuery and Canvas

37. Photobooth with PHP, jQuery and CSS3

( Demo | Download )
Pada tutorial ini, kita akan membangun jQuery dan PHP photobooth bertenaga. Ini akan memungkinkan pengunjung situs Anda untuk mengambil snapshot dengan kamera web mereka dan meng-upload dari antarmuka CSS3 rapi.
Photobooth with PHP, jQuery and CSS3

38. Making a Flickr-powered Slideshow

( Demo | Download )
Dalam tutorial ini kita akan mengembangkan sebuah plugin jQuery yang akan memudahkan untuk membuat slideshow, panduan produk atau presentasi dari set foto Anda Flickr. Plugin akan menggunakan Flickr API dan YQL untuk mengambil foto di set, setelah itu akan menciptakan markup dari slideshow dan mendengarkan peristiwa.
Making a Flickr-powered Slideshow

39. How to Make Auto-Advancing Slideshows

( Demo | Download )
Dengan plugin ini kita dapat membuat muka HTML5 otomatis slide dengan beberapa baris jQuery.
How to Make Auto-Advancing Slideshows

40. Sliding Contents With JQuery

( Demo | Download )
Tujuan Kit Slider adalah untuk mengumpulkan umum slideshow seperti fungsi jQuery (seperti slider berita, foto galeri / slider, komidi putar, tab menu) ke dalam satu plugin ringan dan fleksibel dikombinasikan dengan siap menggunakan CSS skin.
Sliding Contents With JQuery

41. Slides

( Demo | Download )
Slide adalah plugin slideshow untuk jQuery yang dibangun dengan kesederhanaan dalam pikiran. Dikemas dengan satu set fitur yang berguna untuk membantu pengembang pemula dan mahir sama membuat slide yang elegan dan user-friendly.
Slides

42. Slidy

( Demo | Download )
jQuery Slidy adalah plugin yang menghasilkan transisi disesuaikan secara otomatis.
Slidy

9 comments:

  1. Share yang sangat berguna sob bagi mereka yang ingin belajar plugin jquery dan slider, thanks

    ReplyDelete
  2. @ARMAN ok om sama2... thnx sudah berkunjung..

    ReplyDelete
  3. bagus sekali gan artikelnya.. apa lagi sudah disediakan demo dari setiap artikel .. nice gan :-bd

    ReplyDelete
  4. This comment has been removed by the author.

    ReplyDelete
  5. Thanks Gan informasi yang diberikan
    Mantaappp

    ReplyDelete
  6. makasih atas ilmu yang sangat bermanfaat ini

    ReplyDelete
  7. istimewa ini gan.....

    info mobil nissan http://nissandisurabaya.blogspot.com

    ReplyDelete
  8. Sangat bermanfaat nih tutorialnya, makasih yah mas, moga blognya semakin maju

    ReplyDelete
  9. mohon pencerahan untuk yg kuasai jquery.... sya pngen blajar T_T ini email saya : nhia_d@yahoo.com

    ReplyDelete

Perhatian !! Komentar Pada Bulan September 2012 belum bisa di balas.
di karenakan semua admin sedang sibuk dengan urusan kulliahnya.
semoga setelah akhir bulan artikel dan komentar akan segera di update.


terima kasih atas perhatiannya sekali lagi kami minta maaf yang sebesar-besarnya.

 
loading...
Top