CSS3複数の変換

Question

私はcss3アニメーションを持っています。下のコードを使用して、X軸でキューブを回転しています。

@-webkit-keyframes spin2 { 
from { -webkit-transform: rotateX(135deg); } 
to { -webkit-transform: rotateX(855deg); } 
} 

上記のコードと同時にコードを実行すると、キューブは両方の軸で同時に回転できます。

@-webkit-keyframes spin2 { 
from { -webkit-transform: rotateY(135deg); } 
to { -webkit-transform: rotateY(855deg); } 
} 

xとyの回転のコードを追加することはできません。これらを組み合わせる必要があります。これは可能ですか？これは初めてのcss3での作業です。 ご協力いただければ幸いです。

Answer 1

私はこれをテストしていませんが、何

@-webkit-keyframes spin2 { 
    from { 
     -webkit-transform: rotateX(135deg); 
     -webkit-transform: rotateY(135deg); 
    } 
    to { 
     -webkit-transform: rotateX(855deg); 
     -webkit-transform: rotateY(855deg); 
    } 
} 

Answer 2

についてこれは動作するはずです：

.yourElement { 
     -webkit-animation:spin 4s infinite; 
    } 
    @-webkit-keyframes spin { 
     from { 
     -webkit-transform: rotateX(135deg) rotateY(135deg); 
     } 
     to { 
     -webkit-transform: rotateX(855deg) rotateY(855deg); 
     } 
    } 

サンプル：お返事Connumためhttp://jsfiddle.net/KRYRk/1/