微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

我需要一种简单的方法来使用jquery检测CSS3媒体查询支持

我需要一种快速而肮脏的方法来使用jquery检测媒体查询支持.我定义了一个函数如下:
function mediaQueriesEnabled () {
   var v = parseFloat($.browser.version);
   if ($.browser.msie) {
      if (v < 9)
         return (false);
   }
   return (true);
}

有人可以帮我解决这个问题吗?看这个页面

http://caniuse.com/css-mediaqueries

我意识到这里有一些复杂性.例如,当我测试我的safari版本时,我得到“534.57.2”.我现在想避免安装modernizr,主要是因为我处于紧张状态,我需要在短期内处理大多数情况.任何帮助表示赞赏!

解决方法

您可以使用媒体查询创建样式表,看看它是否有效.

在您的HTML中:

<style>@media all and (min-width:1px) {
    .mediatest {position:absolute}
}</style>

(或者你可以动态创建样式表,但这更难)

然后在你的脚本中:

var d = document.createElement('div');
d.className = "mediatest";
document.body.appendChild(d);
if( window.getComputedStyle && window.getComputedStyle(d).position == "absolute") {
    // supports media queries!
}
document.body.removeChild(d);

原文地址:https://www.jb51.cc/jquery/181274.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐