JSFiddle - React, Tailwind, and code Playground

by andrelaszlo

CSS

body {
  width: 100%;
  height: 100%;
  background-color: #333;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center center;
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
  background-size: contain;
}

JavaScript

const url = "https://api.giphy.com/v1/gifs/random?api_key=dc6zaTOxFJmzC&tag=hamster"
const SECONDS = 1000;
const MINUTES = 60*SECONDS;
const HOURS = 60*MINUTES;

function randomize_hamster() {
  $.get(url, function(data){
  	const img_url = data.data.image_url;
    $("body").css('background-image', "url('"+img_url+"')");
  });
}

$(function() {
	randomize_hamster();
  setInterval(randomize_hamster, 10 * MINUTES);
});