JSFiddle - React, Tailwind, and code Playground
HTML
<div class="effectback">
<img class="effectfront" src="http://4.bp.blogspot.com/-Xx79fy4bgiY/Ud4hxcBB11I/AAAAAAAAAng/TOXs7ltd7Ow/s1600/iphone5+angle.png" />
</div>
attribution<br/>
http://graphicburger.com/iphone-5-angle-view-mock-up/
CSS
.effectback {
display: block;
width: 206px;
height: 532px;
background: url('http://4.bp.blogspot.com/-Xx79fy4bgiY/Ud4hxcBB11I/AAAAAAAAAng/TOXs7ltd7Ow/s1600/iphone5+angle.png') no-repeat;
margin: 0 auto;
}
.effectfront {
opacity: 1;
border: none;
margin: 0 auto;
}
.effectfront:hover {
opacity: 0;
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
transition: all 0.3s;
-webkit-transition: all 0.3s;
}