JSFiddle - React, Tailwind, and code Playground
HTML
<div id="large">click here</div>
<div style="height:400px;width:400px;"><div id="upoladedPhoto"></div></div>
CSS
#upoladedPhoto {
position:relative;
cursor:move;
height: 50%;
width: 50%;
max-height:100%;
max-width:100%;
left: 5em;
opacity:0.75;
background: #C8CFA8;
}
#large{
cursor: pointer;
}
JavaScript
$('#large').click(function() {
var height = $('#upoladedPhoto').height();
var width = document.getElementById('upoladedPhoto').clientWidth;
alert(height);
if (height > 150) {
$('#upoladedPhoto').css('height', '95%');
$('#upoladedPhoto').css('width', '85%');
}
});