如何一般测试媒体查询是否受支持？

听起来很奇怪，但我正在寻找一种简单的方法来测试浏览器是否支持any媒体查询。如何一般测试媒体查询是否受支持？

我知道有respondjs，它配备了window.matchMedia填充工具，但即使使用它，我还是要查询具体查询：

window.matchMedia("all and (min-width: 400px"));

它返回一个obj.matches = true/false。

我在寻找的是一种通用的方法来测试，“如果mediaQueries支持”，是或否。

我目前使用：

window.matchMedia("screen and (orienation:landscape), 
         screen and (orientation:portrait)");

，但我真的不喜欢这种测试方式。

我也试过：

window.matchMedia("all");

但（当然）使用matchMedia填充工具时返回true在IE8。另外，我不能测试matchMedia本身，因为我会错过很多支持媒体查询的浏览器，但不是window.matchMedia（caniuse）。

问题：
是否有一个很好的和简单的方法来测试媒体查询支持？如果可能的话，我根本不想使用window.matchMedia来做到这一点。

编辑：
我也查Modernizr，这也测试特定mediaQuery条件（MQ）：

testMediaQuery = function(mq) { 

    var matchMedia = window.matchMedia || window.msMatchMedia; 
    if (matchMedia) { 
    return matchMedia(mq).matches; 
    } 

    var bool; 

    injectElementWithStyles('@media ' + mq + ' { #' + mod + ' { position: absolute; } }', function(node) { 
    bool = (window.getComputedStyle ? 
       getComputedStyle(node, null) : 
       node.currentStyle)['position'] == 'absolute'; 
    }); 

    return bool; 

},

所以没有通用的测试，如果mediaQueries支持。

来源

2013-06-13 frequent

U可以选择Modernizr的这个选项

http://modernizr.com/download/

来源

2013-06-13 09:20:40 koningdavid

见上面我的意见。它还测试特定的条件，又名'testMediaQuery（“all和（orientation：landscape）”）'。 – frequent

@JamesDonnelly 2K我一秒钟就能把握住这一点;-) – frequent

如何一般测试媒体查询是否受支持？

回答

相关问题