8

特に IE < 9 で、 CSS3 background-size: cover のサポートを検出する保存方法は何ですか?

次のテストは、実際にはbackground-sizeをcoverに設定するため、IE < 9 で偽陽性を返します。

div.style.backgroundSize = 'cover';

テスト時に得られる唯一の真の結果：

if ('backgroundSize' in div.style)

しかし、サイトhttp://www.standardista.com/css3/css3-background-properties/#bg11によると、IE 6/7/8 はautoを返す必要があり、 coverとcontainのみがサポートされていません。

編集：

独自のソリューションを使用したいのですが、 Modernizr で使用されているコードを確認しました。彼らは、IE < 9 で偽陽性の結果をもたらすのと同じ手法を使用しているようです: Set backgroundSize = 'cover'を設定してから、 style.backgroundSize == 'cover'を確認します。

私のJSFiddleを参照してください。

4

4 に答える 4

6

を使用Modernizrすると、この種のタスクを実行するために必要なコードのみをダウンロードできます

http://modernizr.com/download/#-backgroundsize-testprop-testallprops-domprefixes

次に、でテストできます

if (Modernizr.backgroundsize) {
    /* backgroundSize supported */
}
于 2012-09-03T08:50:16.137 に答える
0

機能の低いブラウザを検出して、郵便切手の画像が途中でスタックするのを回避しようとしている場合は、手っ取り早い回避策の 1 つとして、

var rules = document.styleSheets[0].cssRules;

定義されていない場合は、ブラウザの機能が低いことがわかり、おそらくフォールバック アプローチを使用する必要があります。YMMV。

于 2013-05-02T22:17:24.233 に答える
0

設定する前に、BackgroundSize がスタイル プロパティとして存在するかどうかを確認する必要があります。

var supported = ('backgroundSize' in document.documentElement.style);
if(supported){
    var temp = document.createElement('div');
    temp.style.backgroundSize = 'cover';
    supported = temp.style.backgroundSize == 'cover';
};
return supported;

ソース: http://upshots.org/javascript/javascript-detect-support-for-background-size-cover

この前に、CSS.supports() で検出を試してみることもできます。MDN を参照してください: https://developer.mozilla.org/en-US/docs/Web/API/CSS/supports

于 2016-10-27T18:12:06.063 に答える
-2

これはjavascriptのみであり、jqueryは使用しているブラウザのバージョンを確認するだけではありません

//check if Is bad IE. 
var noBGSizeSupport = window.attachEvent && !window.addEventListener 

if(noBGSizeSupport){
    //does not support BG size property
} else {
  // supports background size property
}
于 2014-11-01T12:10:29.920 に答える