JSFiddle - React, Tailwind, and code Playground

by MegaScience

HTML

<div id="freddy">

</div>

CSS

html, body {
  padding: 0;
  margin: 0;
  height: 100%;
  width: 100%;
}
body {
  background-color: black;
}
#freddy {
  background-image: url("http://cloud-3.steamusercontent.com/ugc/36356276468125185/A05B9A0E117DE54151B9D43F609BD88FAFD592C2/");
    background-size: 100vmax 100vmax;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: all 0.1s ease 2s;
}

#freddy:hover {
  opacity: 1;
}