SimpleSlideshow

A very simple and lightweight image slideshow - an easy way to showcase your images on your website.

Built with pure Javascript and CSS, to avoid any dependencies.

1. run npm install @tsr1983/simpleslideshow

2. Add the following imports to your file: import initSlideshow from '@tsr1983/simpleslideshow' import "@tsr1983/simpleslideshow/slideshow.css"

3. define the root element where you want the slideshow to appear: <div id='slideshowTarget'></div>

4. Initialize the slideshow by calling initSlideshow(images, {height: 600, width: 800});

5. The 'images' property is an array of objects, each representing an image for the slideshow, with the following properties:

   • You can set the height and width to define the dimensions of the slideshow.
   • url (required): The relative URL to the image from your project or an absolute URL to an image from an external site
   • callback (optional): A callback function, to define what will happen if the user clicks the image.

Example of use

let images = [{url:"https://picsum.photos/400/300"}, {url:"https://picsum.photos/600/600", callback: ()=> {window.open("https://www.google.com")}}, {url:"https://picsum.photos/600/1200"}];

initSlideshow(images, {height: 600, width: 800});