JSFiddle - React, Tailwind, and code Playground

HTML

<div class="pageContainer">

    <img src="http://upload.wikimedia.org/wikipedia/commons/0/07/Jumping_Humpback_whale.jpg"/>
    
</div>

CSS

.pageContainer {
    width:100%;
}

img {
    margin-top: 50%;
    left: 50%;
    
    position: relative;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

JavaScript

$(document).ready(function() {
    var pc = 0;
    var max = 50; // 100% of pageContainer
    function animate() {
        $("img").css("width", (pc+=10) + "%");
        if (pc < max)
            window.setTimeout(animate, 100);
    }
    animate();
});