6

CSS アニメーションを使用する方法を探していますが、ユーザーのブラウザーが CSS アニメーションを実行しない場合は、フォールバックしてアニメーションに Jquery を使用します。Jqueryでこれを行う簡単な方法はありますか? 小さなプラグインであれば、プラグインは問題ありませんが、可能であれば jquery でこれを行う方法を本当に探しています。私が css アニメーションを使用したい唯一の理由は、css アニメーションを使用するときに使用されるプロセッサの電力がはるかに低いためです。

4

3 に答える 3

5

jQuery animate 拡張プラグインは、トランジション対応ブラウザー用の特定のコードを記述する必要なく、CSS トランジションを使用します。

別の方法はあまり心強いものではありません。Modernizr などの機能検出ライブラリを追加してから、次のようなケースごとに特定のコードを書くことができます。

if (Modernizr.csstransitions) {
  $("#yourdiv").css({
    "-webkit-transform" : "translate(0, 10)",
    "-o-transform" : "translate(0, 10)",
    "-moz-transform" : "translate(0, 10)",
    "-ms-transform" : "translate(0, 10)",
    "transform" : "translate(0, 10)"
});
}
else {
  //do jquery animate stuff
}
于 2011-04-10T14:33:38.327 に答える
1

あなたはそれを気にするべきではありません。アニメーションは重要ではありません。プログレッシブ エンハンスメントを行うと、すべてのユーザーがブラウザーで得られる最高のエクスペリエンスを得ることができます :)。

その「プロセッサ パワー」を気にするなら、IE でアニメーションをまったく使いたくありません。それ以外の場合は、特定のニーズに最適と思われる jQuery のみを使用してください。

于 2011-04-11T07:07:12.263 に答える
0

jQuery では、jQuery.supportを使用して、一部の機能がブラウザーによって維持されるようにすることをお勧めします。お気に入り：

jQuery.support.opacity //returns true/false

コア jQuery では CSS3 プロパティをテストできませんが、プラグインではテストできます。関数の説明の後のコメントで、そのようなプラグインのいくつかを見つけることができます (このようなもの) 。

于 2011-04-10T14:32:03.247 に答える