JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://yui.yahooapis.com/3.10.3/build/cssreset/cssreset-min.css">
<div id="container">
    <div id="logo">
        <img src="http://lorempixel.com/100/100/people/6/" alt="" />
    </div>
    <ul id="slidein">
        <li class="rotate" id="r1"><img src="http://lorempixel.com/80/80/sports/2/"></li>
        <li class="rotate" id="r2"><img src="http://lorempixel.com/80/80/sports/3/"></li>
        <li class="rotate" id="r3"><img src="http://lorempixel.com/80/80/sports/4/"></li>
    </ul>
</div>

CSS

#container {
    padding: 20px;
    -webkit-perspective: 500px;
    -moz-perspective: 500px;
    -o-perspective: 500px;
    -ms-perspective: 500px;
    perspective: 500px;
    display: box;
    display: -moz-box;
    display: -webkit-box;
    
    display: -webkit-flex;
	display: -moz-flex;
    display: flex;
}
.rotate {
       
    -webkit-transition-property: left, opacity,webkit-transform;
    -webkit-transition-duration: 3s, 4s, 3s;
    -webkit-transition-timing-function: ease, ease, ease-out;
    -webkit-transition-delay: 0s, .5s, 0s;
    
    -moz-transition-property: left, opacity,moz-transform;
    -moz-transition-duration: 3s, 4s, 3s;
    -moz-transition-timing-function: ease, ease, ease-out;
    -moz-transition-delay: 0s, .5s, 0s;
    
    transition-property: left, opacity,transform;
    transition-duration: 3s, 4s, 3s;
    transition-timing-function: ease, ease, ease-out;
    transition-delay: 0s, .5s, 0s;
    
    -webkit-transform: rotate(-360deg);
    -moz-transform: rotate(-360deg);
    transform: rotate(-360deg);
    opacity:0;
    
}
}
#slidein {
    padding: 20px;
    position: relative;
}

#slidein li {
    position: absolute;
    top: 0;
}
#r1 { left: 1010px; }
#r2 { left: 1100px; }
#r3 { left: 1190px; }

#r1.animRotate { left: 10px; }

#r2.animRotate { left: 100px; }
#r3.animRotate { left: 190px; }

/* ロゴ */
#logo {
    width: 100px;
    -webkit-transition: all 2s cubic-bezier(.83,.09,1,.39);
    -moz-transition: all 2s cubic-bezier(.83,.09,1,.39);
    -ms-transition: all 2s cubic-bezier(.83,.09,1,.39);
    -o-transition: all 2s cubic-bezier(.83,.09,1,.39);
    transition: all 2s cubic-bezier(.83,.09,1,.39);
}
.animRotate {
    opacity:1;
}
.animated {
    -webkit-transform: rotateY(-360deg);
    -moz-transform: rotateY(-360deg);
    -ms-transform: rotateY(-360deg);
    -o-transform: rotateY(-360deg);
    transform: rotateY(-360deg);
}

JavaScript

$(function() {
    $('#logo').addClass('animated');
    
});
$(function() {
    $('.rotate').addClass('animRotate');
    
});