Hover effect

by Julien Roche

HTML

<div class="stacker">
  <img src="https://www.alsacreations.com/xmedia/tuto/exemples/parallaxe/etape3/images/slide1-bg.jpg" width="300" />
</div>

CSS

.stacker {
  height: 190px;
  perspective: 3.5em;
  transform: rotate(35deg) translate(300px, 0px) skew(-25deg);
  width: 300px;
}

.stacker:hover {
  transform: rotate(35deg) translate(250px, -50px) skew(-25deg);
  transition: transform 500ms ease;
}