Slideshow Demo

A first slideshow

A simple demo of how to implement a slideshow using javascript. The file names are stored in an array in slide.js, as are the functions used to load the next/prev image

slide

previous slide         next slide

Code:

let pic = [ "./pics/pancake.jpg", "./pics/dessert.jpg", 
   "./pics/meat.jpg", "./pics/cake.jpg", "./pics/pasta.jpg" ];

let slide = new Array();
let index = 0;//current slide index
function loadImage(url){
	if(document.images){
		rslt = new Image();
		rslt.src = url;
		return rslt;
	}
}
function setUp(){
	if ( document.images ) {
		for(var i in pic) { slide.push(loadImage(pic[i])); }
	}
}
function changeSlide(){
	document.getElementById('display').src = pic[index];
}
function prevSlide(){
	if(--index < 0){
		index = pic.length-1;
	}
	changeSlide();
}
function nextSlide(){
	if(++index >= pic.length){
		index = 0;
	}
	changeSlide();
}