0

これが単純なバックラウンド位置のアニメーションです。マウスアウェイのIE8がアニメーション化しないのはなぜですか？OperaとFirefoxはアクションを表示せず、Chromeだけがうまく機能します。すべての最新バージョンのブラウザで動作させる方法は？

$(function(){
$(".call_order").hover(function() {
    $(this).stop().animate({
        backgroundPositionX: "-300"
    }, 100);
} , function() { 
    $(this).stop().animate({
        backgroundPositionX: "0"
    }, 100);
});

}）;

これがサンプルです

4

1 に答える 1

3

FirefoxとOperaはandをサポートしていませんbackgroundPositionX（backgroundPositionY対応する仕様に含まれていないため）。IE8は。を使用してもバグがあるようbackground-positionです。

backgroundPositionXおよびのブラウザサポートbackgroundPositionY： 

    ブラウザバージョン
    ----------------------------
    Operaはサポートされていません  
    Firefoxはサポートされていません  
    Safari3+  
    IE 4+  
    Chromeはい（バージョンは不明）

したがって、Brandon AaronのjQueryプラグインを使用して、バックグラウンド位置のクロスブラウザーサポートを使用することをお勧めします。

コードを調べると、最初にプロパティをテストbackgroundPositionXし、ブラウザでサポートされているかどうかを確認します。そうでない場合; プロパティからX値とY値を解析しbackgroundPositionます。

注：コメントで提案されているのとは異なり、IE8のサポートが必要なため、CSS3変換は役に立ちません。

于 2013-02-17T20:29:52.683 に答える