Tiny Automatic Image Slideshow Plugin For jQuery - DK-Slideshow

File Size: 6.81 KB
Views Total: 2013
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Tiny Automatic Image Slideshow Plugin For jQuery - DK-Slideshow

DK-Slideshow is a simple, small, cross-browser jQuery slideshow plugin which gives you the ability to fade through a series of images with support for autoplay and infinite looping. To switch between images manually, just click on the right/left side of the current image or the pagination dots at the bottom of the slideshow.

How to use it:

1. Include the jQuery DK-Slideshow plugin's CSS file in the webpage's head section.

<link href="slideshow.css" rel="stylesheet">

2. Create a group of images you want to present in the slideshow.

<div class="slideshow">
  <div class="slideshow__item">
    <img src="1.jpg">
  </div>
  <div class="slideshow__item">
    <img src="2.jpg">
  </div>
  <div class="slideshow__item">
    <img src="3.jpg">
  </div>
  <div class="slideshow__item">
    <img src="4.jpg">
  </div>
</div>

3. Include the jQuery DK-Slideshow plugin's JavaScript file after jQuery library but before the closing body tag.

<script src="//code.jquery.com/jquer.min.js"></script>
<script src="slideshow.js"></script>

4. Invoke the slideshow plugin with default options.

$(".slideshow").slideshow({
  // options here
});

5. Plugin's default options.

$(".slideshow").slideshow({
  "autoPlaySpeed" : 3000,
  "fadeSpeed" : 500,
  "hoverStop" : false,
  "nav" : false,
  "dots" : false
});

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