I have a box that is flat on load but rotates on hover. Setup:
<div class="work-box">
<div class="face primary">
<div class="work-name">The library</div>
<div class="blue"></div>
</div>
<div class="face secondary">
<div class="cover" data-workid="69"></div>
<div class="red"></div>
</div>
</div>
working example: http://jsfiddle.net/74ccbpke/
My issues when the mouse moves the animation flickers. Also when I click the mouse the animation resets on mouse down and returns on mouse up.