jquery - jqueryでcss 3dtransformプロパティをdom要素に追加するには?

Question

こんにちは、IOS モバイル デバイス用に jquery を使用してアニメーションを最適化しようとしています。考慮したい 3D レンダリング エンジンの使用に関するこの既知の問題があります。

今、私はこのようないくつかの変換をしたい:

$('.class').css({"-webkit-transform:":"translate3d(200px, 200px, 0px)"});

しかし、これはうまくいきません！CSSは追加されていません！

Answer 1

コードの残りの部分を知らずに、適用しました-webkit-transitionか？そうでなければ、効果はほとんどすぐに起こります。

以下は私にとってはうまくいきます（jsfiddle-> http://jsfiddle.net/RQzn6/で動作します）

HTML

<div id="container">
    <div id="box">Hello</div>
</div>

CSS

#container {
    -webkit-transform-style: preserve-3d;
    -webkit-perspective: 100px;
}

#box {
    width: 200px;
    height: 100px;
    background-color: gray;
}

jQuery

$("#box").click(function() {
    $(this).css({'-webkit-transform':'translate3d(200px, 200px, 0px)',
                 '-webkit-transition': 'all 1s ease-out'});
    });

Answer 2

私は昨日Transitを発見しました。ライブラリを追加することを気にしなければ、簡単に見つけられるかもしれません。