JSFiddle - React, Tailwind, and code Playground

by 3rror404

HTML

<div>

</div>

CSS

div {
  width: 100vw;
  height: 100vh;
  background-size: cover;
  background-position: center;
  background-image: url(//placekitten.com/299/299);
}

JavaScript

console.log('Test');

const images = ['//cometothegarden.kuzu.software/img/anims/anim-01.jpg','//cometothegarden.kuzu.software/img/anims/anim-02.jpg','//cometothegarden.kuzu.software/img/anims/anim-03.jpg','//cometothegarden.kuzu.software/img/anims/anim-04.jpg','//cometothegarden.kuzu.software/img/anims/anim-05.jpg','//cometothegarden.kuzu.software/img/anims/anim-06.jpg'];

const box = document.querySelector('div');

let imgIndex = 0;
setInterval(function() {
	box.style.backgroundImage = `url(${images[imgIndex]})`;
  
  imgIndex++;
  
  if (imgIndex >= images.length) {
  	imgIndex = 0;
  }
  
}, 0.6);