9

CSS3 アニメーションが IE で動作しないことを理解しています。この問題に対する JavaScript の回避策があるかどうか疑問に思っていました。

IE で再作成したいものへのリンクは次のとおりです: http://animation.kashoo.co.uk/

どんなアドバイスも素晴らしいでしょう。

4

3 に答える 3

11

簡単な Google 検索の後、jQuery の標準の $.animate() 関数を変更して、可能な限り CSS3 トランジションを使用するようにする jQuery プラグインを見つけました。

$.animate-enhanced

編集：

私のサイトで上記のプラグインを試したところ、サイトが壊れました。同じ問題が発生するかどうかはわかりませんが、私の回避策は次のとおりです。

Modernizr.jsが必要です

基本的に、ブラウザーが特定の機能をサポートしているかどうかを (Modernizr で) チェックしてから、CSS3 と Javascript のどちらでアニメーション化するかを決定します。

例えば：

(オブジェクトをアニメーション化して 200px 右に移動するとします)

if(Modernizr.csstransitions) {
    // use your appropriate browser prefixes
    yourDomObject.style.transition = 'left 2s';
    yourDomObject.style.left = parseInt(yourDomObject.style.left) + 200 + 'px'

} else {

    var left = parseInt($(yourDomObject).css('left')) + 200 + 'px';
    $(yourDomObject).animate({
        'left' : left
    },2000,'easeOutExpo');
}
于 2012-08-06T14:21:04.550 に答える
3

jQuery のアニメーション機能をチェックしてください: http://api.jquery.com/animate/

于 2012-06-01T17:25:45.113 に答える
1

アニメーションを提供する多くの JQuery プラグインがあります。これは、探しているものと同様の反転効果を持つものです。http://lab.smashup.it/flip/

于 2012-06-01T17:25:22.993 に答える