JSFiddle - React, Tailwind, and code Playground

by Matt Hopkins

HTML

<div class="de elImageWrapper de-image-block elAlign_center elMargin0 ui-droppable de-editable" id="tmp_image-67336" data-de-type="img" data-de-editing="false" data-title="image" data-ce="false" data-trigger="none" data-animate="fade" data-delay="500"
style="margin-top: 0px; outline: none; cursor: pointer;" aria-disabled="false" data-hide-on="desktop">
  <img src="https://images.clickfunnels.com/65/dfd9e0c4c511e794cf956b768f0efb/S1-Clean-1000h.png" class="elIMG ximg" alt="">
  <img src="https://images.clickfunnels.com/93/1f93c0c9a011e780ed434488c20d67/S1-Left-Clean-1000h.png" class="elIMG ximg" alt="">
</div>

CSS

#tmp_image-67336 {
  -webkit-perspective: 1000;
  -moz-perspective: 1000;
  -o-perspective: 1000;
  perspective: 1000;
  position:relative;
  overflow: hidden;
}

#tmp_image-67336:hover img:first-of-type,
#tmp_image-67336.hover img:first-of-type {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

#tmp_image-67336:hover img:nth-of-type(2),
#tmp_image-67336.hover img:nth-of-type(2) {
  -webkit-transform: rotateY(360deg);
  -moz-transform: rotateY(360deg);
  -o-transform: rotateY(360deg);
  transform: rotateY(360deg);
}

#tmp_image-67336 img:first-of-type, #tmp_image-67336 img:nth-of-type(2) {
  width: 100%;
  height: auto;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
  float:left;
}

#tmp_image-67336 img:first-of-type, #tmp_image-67336 img:nth-of-type(2) {
  -webkit-transition: 0.6s;
  -webkit-transform-style: preserve-3d;
  -moz-transition: 0.6s;
  -moz-transform-style: preserve-3d;
  -o-transition: 0.6s;
  -o-transform-style: preserve-3d;
  transition: 0.6s;
  transform-style: preserve-3d;
}


#tmp_image-67336 img:nth-of-type(2) {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}