jquery – 媒体查询Chrome中错误宽度的最大宽度启动

前端之家收集整理的这篇文章主要介绍了jquery – 媒体查询Chrome中错误宽度的最大宽度启动前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

编辑:更多研究表明这实际上与jQuery returns wrong width and height in Chrome 18.0.1025.168有关

我在当前的wordpress主题项目中设置了一些媒体查询以及一些javascript.一般来说,他们工作正常,但(!)媒体查询

@media only screen and (max-width: 980px)

已经在1075px进行效果.

$(document).width()
1075
$("body").width()
1019.4444427490234

这种情况发生在Chrome中,但在Safari中,它的行为与预期相似.我还没有检查过任何其他浏览器.

你可以用javacript改变元素的宽度以某种方式破坏查询“launch-widths”吗?

CSS:

@media only screen and (max-width: 1060px){
.excerpt{
    width: 500px;
    float: left;
    font-size: 13px;
}
}
@media only screen and (max-width: 980px){
.hentry{
    height: auto;
}
.thumbnail,.excerpt{
    float: none;
    max-height: none;
}
p{
    font-size: 15px;
}
#site-description{
    display: none;
}
} 

在此之前最新添加的javascript:

if($(window).width()<1065 || $(document).width()<1065){
    if($(document).width()>980){
        $(".excerpt").width($(".hentry").width()-515);
    } else{
        $(".excerpt").css("width","");
    }
}
最佳答案
你确定它与jQuery有关吗?

我有同样的问题(媒体查询触发错误的宽度),原因是我在Chrome中的缩放级别不是100%.我知道,愚蠢的我.

只需按cmd 0或ctr 0即可默认为100%.

猜你在找的jQuery相关文章