JSFiddle - React, Tailwind, and code Playground

CSS

body{
 -webkit-transform-style:preserve-3d;
 -webkit-perspective-origin:50% 50%;
 -webkit-perspective:5000px;
}
.multiflip, .multiflip div{
 width:144px;
 height:472px;
 position:absolute;
 -webkit-transform-style:preserve-3d;
 -webkit-transform-origin:0 0;
 -webkit-transition:-webkit-transform 400ms ease;
 background-color:black;
 background-image:url(http://i.imgur.com/8UvUxaK.png);
    /*-webkit-backface-visibility: hidden;*/
}
.multiflip{
 -webkit-transform:scale(.5);
 -webkit-transform-origin:50% 50%;
}
.multiflip div{
 top:0px;
 left:100%;
}
.multiflip:hover div{
 -webkit-transform:rotateY(-7deg);
}
.multiflip{background-position:0 0;}
.multiflip>div{background-position:-144px 0;}
.multiflip>div>div{background-position:-288px 0;}
.multiflip>div>div>div{background-position:-432px 0;}
.multiflip>div>div>div>div{background-position:-576px 0;}

JavaScript

function DOM(rows){
 var div=document.createElement('div');
 while(--rows)div=document.createElement('div').appendChild(div).parentNode;
 div.className='multiflip';
 return div
};
console.log(DOM(3));

var i='http://i.imgur.com/8UvUxaK.png';

function loadImg(a){
 var img=document.createElement('img');
 img.onload=checkImg
 img.src=a;
}
function checkImg(){
 this.width;
 this.height;
}
document.body.appendChild(DOM(5));