when clicking on an image next image comes and this process continues
<html> <body> <img id="slide" src="img_nature.jpg" width="100%" height="100%"> <script> var myImage = document.getElementById("slide"); var imageArray = ["img_nature_wide.jpg","img_fjords_wide.jpg","img_mountains_wide.jpg","img_lights_wide.jpg","img_nature_wide.jpg"]; var imageIndex = 0; function changeImage() { myImage.setAttribute("src",imageArray[imageIndex]); imageIndex++; if (imageIndex >= imageArray.length) { imageIndex = 0; } } // setInterval is also in milliseconds var intervalHandle = setInterval(changeImage,2000); myImage.onclick = function() { clearInterval(intervalHandle); } </script> </body> </html>