Minimalist Background Slideshow Plugin - jQuery slideshow.js

Minimalist Background Slideshow Plugin - jQuery slideshow.js

A minimal, simple-to-use, jQuery based, cross-fading slideshow that dynamically loads backgrounds from an array of images.

1. Load the slideshow.js after loading jQuery.

<script src="" 
<script src="slideshow.js"></script>

2. Create a new Slideshow instance and specify the container in which the slideshow will be placed.

<div class="example" id="demo">
var slideshow = new Slideshow({
    backgroundElementId: "demo"

3. Define an array of background images for the slideshow.


4. Activate the background slideshow.;

5. Config the animation speed & autoplay interval.

var slideshow = new Slideshow({
    tickInterval: 5000,
    transitionTime: 800,
    backgroundElementId: "demo"

9. Make the background images always be centered in the container.

.example {  
  background-position: 50% 50%; 
  background-size: cover;

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

  • Publication date: 29.12.2018
  • Source