JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.2.0.min.js"></script>
<div class="anim">
						<div class="a" style="background-image: url(http://sneakerbardetroit.com/wp-content/uploads/2015/02/adidas-superstar-foundation-core-black-white.jpg)"></div>
						<div class="b" style="background-image: url(https://www.wired.com/wp-content/uploads/2016/05/easyjet-shoes-lead.jpg"></div>
</div>

CSS

.anim div{
    	width: 250px;
    	height: 250px;
    	transition: ease all 1s;
      background-size: cover;
}

.anim div.transformed.a{
	    transform: translate(150%, -11%);
	    width: 125px;
      height: 125px;
 }

.anim div.transformed.b {
		  transform: translate(50%, -110%);
    	width: 125px;
      height: 125px;
 }

JavaScript

$(".anim div").addClass('transformed');