JSFiddle - React, Tailwind, and code Playground

HTML

<div class="ArticleImgHP-container">
        <!-- An huge image which has to be loaded -->
        <img class="ArticleImgHP" src="http://www.lzsu.com/uploads/Big-Wave-Wallpaper.jpg" onload="onLoadFunction(this);"/>
<img  src="http://demo.travelkashmir.net/ImagesArticles/d17f0766-dac7-482e-bf2e-1409321a490dTN.png" >
    </div>

CSS

img.ArticleImgHP {
            /* Set the width and height to the size of its container */
            width : 100%;
            height : 100%; 
            visibility : hidden;
        }
        div.ArticleImgHP-container { 
            width : 124px;
            height : 124px;
            background-image : url('http://www.speikboden.it/_medien/bilder/loader2.gif');
            background-position: center center;
            background-repeat: no-repeat;
        }

JavaScript

function onLoadFunction(img) {
         $(img).css("visibility", "visible"); // Using jQuery
         // img.style.visibility = "visible"; // Using just javascript.
      }