Flipping Test

por **Admin** Miér Mar 16, 2016 7:56 pm

Código:: <div class="flip-container" ontouchstart="this.classList.toggle('hover');"> <div class="flipper"> <div class="front"> <img src="http://i.imgur.com/LwW5uMu.png"/> </div> <div class="back"> <img src="http://i.imgur.com/LjUMW1M.png"/> </div> </div> </div> <style>.flip-container {position:relative;-webkit-perspective:1000;perspective:1000;}.flip-container:hover .flipper, .flip-container.hover .flipper{transform: rotateY(180deg);}.flip-container, .front, .back {width: 228px;height: 322px;}.flipper {transition: 0.6s;transform-style: preserve-3d;position: relative;}.front, .back {backface-visibility: hidden;position: absolute;top: 0;left: 0;}.front {z-index: 2;transform: rotateY(0deg);}.back{transform: rotateY(180deg);}</style>