create slideshow and rotates images with transitions
You have not set up any pictures in your HTML Code. You init the Slideshow with a picture array. When you start the Slideshow, it will be check if the picture is in the DOM tree, if not it will create a new image element and insert it in the DOM tree.
add fadeIn and fadeOut effect for smooth transistion.
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.
Download the two files: slideshow.css and slideshow.js and link them in your project like:
<link rel="stylesheet" href="slideshow.css"> <script src="slideshow.js"></script>
or without downloading files like
<link rel="stylesheet" href="https://rawgit.com/SebCon/slideshow/master/slideshow.css"> <script src="https://rawgit.com/SebCon/slideshow/master/slideshow.js"></script>
creating picture array
var pictures = [ new Picture('pic1.jpg', 'here is my alt and title Text'), new Picture('pic2.jpg', 'here is my alt and title Text'), new Picture('pic3.jpg', 'here is another alt ant title Text'), .... ];
var slider = new Slideshow('slideshow', pictures, 4000);
- Sebastian Conrad - Initial work - sebcon
This project is licensed under the MIT License - see the LICENSE.md file for details