JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/unveil/1.3.0/jquery.unveil.js"></script>
<div class="container">
  <div class="wrap">
    <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://unsplash.it/1000/500?image=631"  height="500" />
  </div>
</div>

CSS

.container {
    border: 1px solid blue;
    width: 50%;
    padding: 5px;
}
.wrap {
    position: relative;
    padding-bottom: 50%;
    width: 100%;
    height: 0;
}
img {
    position: absolute;
    border: 1px solid red;
    width: 100%;
}

JavaScript

$(document).ready(function() {
//  $("img").unveil();
});