css - CSS33Dキーフレーム変換を一時停止できません

Question

Android Webkitブラウザー（4.x）でアクションが発生したときに、キーフレームの変換を停止する際に問題が発生します。

このCSSがあるとしましょう（無限に回転する赤いボックスを作成します）：

#test
{
    width:150px;
    height:150px;
    background:red;
    position:absolute;
    -webkit-transform: translate3d(48px,95px,0px);
    top:0px;
    left:0px;
    -webkit-animation-name: mymove;
    -webkit-animation-play-state: running;
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 5s; 
    -webkit-animation-iteration-count: infinite ;
    -webkit-animation-fill-mode: forwards; 
}

@-webkit-keyframes mymove 
{
    0%   { -webkit-transform: translate3d( 48px, 95px, 0px ) rotate( 0deg ) ;}
    100% { -webkit-transform: translate3d( 48px, 95px, 0px ) rotate( 360deg ) ;}
}

そしてHTMLでは、idが「test」で、onTouchStartアクションがJSを使用して回転を（運がなく）停止しようとしているdivがあります

this.style.webkitAnimationPlayState = 'paused'

これを変更すればこの問題は解決-webkit-transform: translate3d( 48px, 95px, 0px ); します-webkit-transform: translate( 48px, 95px ); が、3D変換が必要です。そうしないと、作成するオブジェクトが多いため、パフォーマンスの問題が多く発生します。

前もって感謝します