Simple Automatic Gallery Slideshow In jQuery

A simple, configurable, automatic gallery slideshow plugin written in jQuery and plain HTML/CSS.

The slideshow automatically fade through a list of images at a given interval. You can also play/pause or navigate throuhg images manually by clicking the controls that will be displayed on hover.

How to use it:

1. Insert the latest jQuery JavaScript library together with the jquery-gallery.js plugin's files into the html file.

<link href="jquery-gallery.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.3.1.min.js" 
        integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT" 
        crossorigin="anonymous"></script>
<script src="jquery-gallery.js"></script>

2. Create an image list for the gallery slideshow.

<ul class="gallery-slideshow">
  <li><img src="1.jpg"/></li>
  <li><img src="2.jpg"/></li>
  <li><img src="3.jpg"/></li>
  <li><img src="4.jpg"/></li>
  <li><img src="5.jpg"/></li>
  <li><img src="6.jpg"/></li>
  ...
</ul>

3. Convert the image list to a gallery slideshow with specified interval and height/width. Done.

$(function() {
  $('.gallery-slideshow').slideshow({
    // default: 2000
    interval: 3000,
    // default: 500
    width: 600,
    // default: 350
    height: 400
  });
});

---

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