Jquery/CSS - transform：rotate（0deg）not working

Question

コンテキスト：少年の人物が女の子の姿まで歩いて止まる基本的なアニメーションを作成しています。私はそれを達成するためにCSS3翻訳を使用しています。私はJavascriptのイベントを使用しています移動から手や足を停止するには -

boy.addEventListener("webkitAnimationEnd", animation_end); 

、最終的にはjQueryの

$('#boy-right-leg').css('-webkit-animation-play-state','paused'); 

を私は足がまっすぐ、しかし、それを超えたことにしたいです。

問題：JqueryのCSS機能が動作していません。脚はまだ交差しています。脚はまっすぐでなければなりません。

修正方法を教えてください。

ブラウザ - Safari。

全体コード - http://codepen.io/tusharsaurabh/pen/QKXXmY

注意してください - 私はJavascriptを始めたが、私は多くのことを試してみましたが、ゆっくりとjQueryのに移動し、問題を解決するよう 1.私のコードは、jQueryとJavascriptのが混在しています。

Answer 1

'animation-play-state'の値を 'paused'に変更すると、トランスフォームは同じ瞬間に値を保持したままになります。

この値を削除するには、たとえば 'animation-iteration-count'を1に変更するか、値を 'none'に変更してアニメーションを削除します。しかし、値が変わらないことに気づくと、それは単にジャンプするだけです。