0

ブラウザーがサポートしtranslate3dているかどうかを検出するには (WebKitCSSMatrixウィンドウ内 && m11new WebKitCSSMatrix() 内)

しかし、現在、Firefoxtranslate3dはそれを正しく検出する方法をサポートしていますか?

アイデアは、Modernizr を使用せずに解決策を見つけることです。

4

2 に答える 2

3

似たようなものが必要でした。ライブラリを使用せずに、ブラウザーが translate3d をサポートしているかどうかをテストしたかったのです。Webkit 固有ではない、適切な一般的なテストが見つかりませんでした。そのため、多くの実験の後、次のテストを思いつきました。最初にテスト要素を作成し、それに変換関数を割り当ててから、要素が変換関数を保持しているかどうかを確認します。

function Has3DSupport()
{
    var sTranslate3D = "translate3d(0px, 0px, 0px)";

    var eTemp = document.createElement("div");

    eTemp.style.cssText = "  -moz-transform:"    + sTranslate3D +
                          "; -ms-transform:"     + sTranslate3D +
                          "; -o-transform:"      + sTranslate3D +
                          "; -webkit-transform:" + sTranslate3D +
                          "; transform:"         + sTranslate3D;
    var rxTranslate = /translate3d\(0px, 0px, 0px\)/g;
    var asSupport = eTemp.style.cssText.match(rxTranslate);
    var bHasSupport = (asSupport !== null && asSupport.length == 1);

    return bHasSupport;
} // Has3DSupport

この関数は、私のニーズに対して十分に高速です。デスクトップ ブラウザーで 50 マイクロ秒未満、モバイル ブラウザーで 500 マイクロ秒未満です。

お役に立てれば。

于 2012-08-08T17:36:25.873 に答える