JSFiddle - React, Tailwind, and code Playground

HTML

<button>Try it</button>

<div id="myDIV">
<h1>myDIV</h1>
</div>

CSS

#myDIV
{margin:auto;
border:1px solid black;
width:200px;
height:100px;
background-color:coral;
color:white;
-webkit-transform: translateY(-100px);
-moz-transform: translateY(-100px);
-o-transform: translateY(-100px);
-ms-transform: translateY(-100px);
transform: translateY(-100px);
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}

JavaScript

var img = new Image();
img.setAttribute('height', 10);
function myFunction() {
    // jQuery should take care of the vendor prefixing of translateY for you
    $('#myDIV').css('transform', 'translateY(-' + (img.height - 10) + 'px)');
    img.src = 'http://www.google.com/intl/en_ALL/images/logo.gif';
}

$('button').click(myFunction);