JSFiddle - React, Tailwind, and code Playground

HTML

<input id="ranger" type="range" min="1" max="100" value="100" />
<hr />
<img id="image" src="http://www.aranzgeo.com/__data/assets/image/0013/14251/logo.png" width="275" height="95" />

CSS

img{
    position: relative;    
}

JavaScript

var ranger = document.getElementById('ranger'),
image =  document.getElementById('image'),
width = image.width,
height = image.height;

ranger.onchange = function(){
image.width = width * (ranger.value / 100);
image.height = height * (ranger.value / 100);
    
image.style.left=(width/2-image.width/2+"px");
image.style.top=(height/2-image.height/2+"px");    
}