Image Slideshow

TITLE : Image Slideshow Under 5 Minutes | Image Slider | HTML ,CSS and JavaScript

HTML :

<html>

<head>

<title>Automatic Image Slideshow</title>

</head>

<body>

</div>

</body>

</html>

CSS :

* {

margin: 0;

padding: 0;

box-sizing: border-box;

}

body {

width: 100%;

height: 100vh;

display: flex;

justify-content: center;

align-items: center;

}

.box {

width:60%;

height: 70%;

box-shadow: 0 0 25px -3px rgba(0,0,0,0.4);

}

.box img{

width:100%;

height: 100%;

}

JavaScript :

var images = ['images/img1.png','images/img2.jpg','images/img3.jpg','images/img4.jpg','images/img5.jpg'];

var i =0;

function slideShow() {

document.getElementById("image").src=images[i];

if(i<images.length-1){

i++;

}

else {

i=0;

}

setTimeout("slideShow()" , 2000);

}

window.onload = slideShow;