以下のコードを使用して CSS3 でグラフィックを回転させている場合 (これは単なる Webkit バージョンですが、スタイル シートには他のブラウザー固有のバージョンがあります)。
.bottomSmallCogStopAnimating {
-webkit-animation-name: rotate;
-webkit-animation-duration: 5000ms;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
}
jQuery を使用してこの css クラスを追加し、アニメーション名を削除してアニメーションを停止しています。
.stopAnimating {
-moz-animation: none;
-webkit-animation: none;
animation: none;
}
このプロパティを削除すると、グラフィックが回転前の状態にリセットされるように見えるため、グラフィックが元の回転に戻り、見た目がかなり悪くなります。
これが起こらないようにする方法はありますか?ブラウザは最後の位置を記憶し、この時点でアニメーションを停止しますか?
乾杯、ステファン