CSS3는 + jQuery를 플립 카드 문제를 변환

Question

여기에 바이올린입니다 : http://jsfiddle.net/DerekL/pwbu4/6/

나는 "플립 카드"효과를 만드는 CSS3의 transform 속성을 제어하기 위해 jQuery를 사용하고가. 데모에서 분홍색 사각형을 가리키면 아래쪽으로 뒤집어 뒷면을 나타냅니다. 커서가 분홍색 사각형 위치로 이동하면 애니메이션이 다시 시작됩니다. mouseenter 및 mouseleave 인 경우에만 사각형을 뒤집을 것으로 가정합니다. 그래서 기본적으로 사각형을 움직일 때 플립은 rotateX으로 끝나기 때문에 사각형을 벗어나지 않습니다. 어떻게 해결할 수 있습니까?

Answer 1

Esailija의 의견을 바탕으로 조금 개선되었지만 다른 래퍼를 추가하면 문제가 해결됩니다.

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