JSFiddle - React, Tailwind, and code Playground

by gabs00

HTML

<img id="arrow2" src="https://i.imgur.com/w8jxzG4.jpg" />

JavaScript

var imgUrls = [
	"https://i.imgur.com/w8jxzG4.jpg",
  "https://i.imgur.com/dsqMGDf.jpg",
  "https://i.imgur.com/Ju8MUkn.jpg"
];

function rotateImages(index){
	$('#arrow2').attr('src',imgUrls[index]);
}
var i = 0;
var len = imgUrls.length;
var id;
function loop(){
		id = setTimeout(function(){
  	rotateImages(i);
    i++;
    if(i > len){
    	i = 0;
    }
    loop();
  }, 3000);
}

$(document).on('click', function(e){
	clearInterval(id);
  loop();
});