首页 > 编程语言> > javascript – 如何阻止respond.js阅读我的视网膜显示媒体查询？

javascript – 如何阻止respond.js阅读我的视网膜显示媒体查询？

2019-07-23 13:35:16 作者：互联网

我已经添加了respond.js来激活ie7中的媒体查询,我现在遇到的问题是ie7 8现在似乎正在阅读视网膜显示媒体查询,你可以想象它正在弄乱我的布局.有没有其他人遇到这个问题,如果是这样,怎么能防止这个？

    @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
}

更新任何有同样问题的人：

基本上我将任何高清媒体查询移动到他们自己的.css文件(hd.css)中,然后在我的网站部分中添加一个条件语句,以防止IE IE 8看到它.

解决方法:

您可以使用jQuery将特定于IE检测的类(如果您还没有)添加到您的html标记中,就像Modernizr对浏览器功能一样.然后将样式包装在媒体查询中：

@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {

   html.no-ie div#mydiv{
      /* STYLES FOR #mydiv HERE */
   }

}

使用jQuerys $.browser属性检测浏览器并在html标记中添加一个类(带有版本……因为……为什么不呢？)：

/* CHECK IF BROWSER IS IE */
if($.browser.msie){
   /* GET THE BROWSER VERSION...BECAUSE WE CAN! */
   var version = $.browser.version;

   /* ADD CLASSES FOR BROWSER + VERSION TO HTML TAG ie. <html class="ie ie6"> */
   $('html').addClass("ie ie" + Math.floor(version));
}

希望这很有帮助.

标签：javascript,jquery,css,media-queries,jquery-plugins
来源： https://codeday.me/bug/20190723/1513978.html