CSS3转换+ jQuery翻转卡问题

Question

这里是小提琴：http://jsfiddle.net/DerekL/pwbu4/6/

我正在使用jQuery控制CSS3中的transform属性来创建一个＆＃34;翻转卡＆＃34;影响。在演示中，如果你悬停在粉红色的方块上，它将向下翻转并显示背面。问题是如果将光标移动到粉红色的方形位置，动画将再次开始。它应该仅在mouseenter和mouseleave时翻转方块。所以基本上当你在广场上移动时，它甚至不会离开广场，因为翻转是由rotateX完成的。那么我该如何解决这个问题呢？

Answer 1

基于Esailija的评论并略微改进，但添加另一个包装将解决它。

http://jsfiddle.net/DerekL/pwbu4/11/