Responsive Photo Gallery / Slider Plugin For jQuery - vit-gallery

File Size: 26 KB
Views Total: 16930
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Responsive Photo Gallery / Slider Plugin For jQuery - vit-gallery

vit-gallery is a jQuery gallery plugin which gives you the ability to showcase the photos in a responsive slider/slideshow interface with bullet or smoothly scrolling thumbnail navigation.

How to use it:

1. Add your images together with the thumbnails, controls and image captions to the gallery/slider following the html structure like this:

<div class="gallery">

  <div class="gallery__img-block  ">
      <span class="">
          Image Description 1
      <img src="img_1.jpg" thumb-url="img_1.jpg" class="">
  <div class="gallery__img-block current">
      <span class="">
          Current Image
      <img src="img_21.jpg" thumb-url="img_21.jpg" class="">
   <div class="gallery__img-block ">
      <span class="">
          Image Description 3
      <img src="img_2.jpg" thumb-url="img_2.jpg" class="">
   <div class="gallery__img-block ">
      <span class="">
          Image Description 4
      <img src="img_3.jpg" thumb-url="img_3.jpg" class="">
  <div class="gallery__controls">


2. Put jQuery library and the jQuery vit-gallery plugin's files into the webpage.

<!-- Main stylesheet -->
<link rel="stylesheet" type="text/css" href="__main.css">
<!-- JavaScript -->
<script src="//"></script>
<script src="gallery.js"></script>

3. Initialize the gallery/slider with default options.


4. All default options to customize the gallery/slider.

  buttons: true,
  galleryHeight: 'auto',
  imgBlockClass: 'gallery__img-block',
  controls: 'thumbnails', // points thumbnails
  controlsClass: 'gallery__controls',
  thumnailWidth: 90,
  thumnaiHeight: 60,
  thumbnailMargin: 5,
  animateSpeed: 1000,
  description: true,
  imgPadding: 15,
  autoplay: false,
  autoplayDelay: 3000,
  fullscreen: false,
  transition: 'slide' // slide crossfade

Change log:


  • added new slide effect

This awesome jQuery plugin is developed by vit134. For more Advanced Usages, please check the demo page or visit the official website.