0

回転をアニメーション化しようとしている次の画像があります。

ここに画像の説明を入力

画像の現在のCSSはこれです（画像には「p5easy」のクラスがあります：

.p5easy{ 
   transform:rotate(-90deg);
   -ms-transform:rotate(-90deg); /* IE 9 */
   -webkit-transform:rotate(-90deg); /* Safari and Chrome */
}

次に、jQuery を使用して画像をアニメーション化しようとしています。私は次のことをしています：

$('.p5easy').delay(0).show().animate({'-webkit-transform':'rotate(0deg)'},{duration: 1000});

よくわかりませんが、これはうまくいきません。私はこれに正しい方法で取り組んでいますか？jQuery animate は回転をサポートしていますか、それとも別のプラグインが必要ですか?

ここにフィドルがありますhttp://jsfiddle.net/jvpEN/

4

2 に答える 2

1

これを試して

$('.p5easy').animate({  textIndent: 0 }, {
    step: function(now,fx) {
      $(this).css('-webkit-transform','rotate('+now+'deg)'); 
    },
    duration:'slow'
},'linear');
于 2013-09-30T11:22:19.370 に答える
0

I'm probably a bit (a year) late, but you can try one of these: http://www.jqueryrain.com/2012/08/jquery-flip-effect-plugin-examples/

于 2014-04-29T22:31:34.843 に答える