1

ブラウザーでの CSS3 メディア クエリのサポートを検索したところ、IE9+ でサポートされていましたが( http://caniuse.com/css-mediaqueries)、Modernizrを使用してそれを検出すると、ie7-ie9 ではサポートされていませんが、ie10 ではサポートされていることがわかりました。 . 私がすることは：

  1. カスタムの modernizr js を生成します: http://modernizr.com/download/#-mq-teststyles-load

  2. html コード: 以下は html ヘッド内の私のコードです。ブラウザが最小幅のメディア クエリをサポートしているかどうかを検出したいです。サポートされている場合は support.js を追加し、サポートされていない場合は nosupport.js を含めます。

    <script src="modernizr.custom.03829.js" type="text/javascript"></script>
<script>
    Modernizr.load({
        test: Modernizr.mq('(min-width: 0px)'),
        yep: 'support.js',
        nope: 'nosupport.js'
    });
</script>

  3. support.js の場合: alert("support");

  4. nonosupport.js の場合: alert("サポートされていません");

結果: ie7-ie9 アラートは「サポートされていません」、ie10 ではアラート「サポート」。ie9も「サポート」に警告するべきだと思いますよね？私のコードに何か問題がありますか?

別の奇妙なことは、 http://modernizr.com/docs/#mqのサンプル使用法を使用する場合です 。

Modernizr.mq('only screen and (max-width: 768px)')  // true

Chrom、firefox、IE7-10 は「サポートされていません」と警告しますが、最近のブラウザは「サポートしています」と警告するべきだと思います。なんで？

4

1 に答える 1

1

あなたの最初の質問について - 私は再現できません。Modernizr.mq('(min-width: 0px)')私にとってはIE 9でtrueを返します。F12 ツールでドキュメント モードをチェックして、非標準モードにフォールバックしているかどうかを確認します。

次に、ブラウザーの最新性は、true が返されるかどうかとは関係ありません。Modernizr.mqブラウザがメディア クエリに一致するかどうかをテストします。false の場合、ブラウザ ウィンドウが 768 ピクセルより大きいことを意味します。

于 2013-11-20T06:03:48.303 に答える