JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <img id="img" src="http://x3.cdn03.imgwykop.pl/c3201142/comment_F4x4ftxkYy1WgboSDMFlA4jt9qqMCrIP.jpg">
</body>

CSS

body, html
{
    margin: 0;
    padding: 0;
    border: 0;
    width: 100%;
    height: 100%;
    background: #f00;
}
			
img {
    margin: 0;
    border: 0;
    display: block;
				
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

JavaScript

function setImgSize(img, aspectRatio) {

    var windowHeight = $(window).height();
    var windowWidth  = $(window).width();


    if (windowWidth/windowHeight >= aspectRatio)
    {
        img.height(windowHeight);
        img.width(windowHeight * aspectRatio);
    }
    else
    {
        img.width(windowWidth);
        img.height(windowWidth / aspectRatio);
	}
				
}
			
$(window).on('load', function(){
	img = $('#img');
	imgAspectRatio = img.width() / img.height();

	setImgSize(img, imgAspectRatio);
});
						
$(window).on('resize', function(){
	setImgSize(img, imgAspectRatio);
});

$('body').on('click', function(){
	alert("Image width: "+ img.width() 
          + "\nImage height: " + img.height() 
          + "\nImage aspect ratio base: " + imgAspectRatio 
          + "\nImage aspect ratio current: " + img.width()/img.height() 
          + "\n\nWindow width: " + $(window).width() 
          + "\nWindow height: " + $(window).height() 
          + "\nWindow aspect ratio: " + $(window).width()/$(window).height());
});