[英]javascript shows different screen resolution
When I use availHeight
oder height
, as suggested here , I get a different resolution from what my OS tells me. 当我按照这里的建议使用availHeight
oder height
,得到的分辨率与操作系统告诉我的分辨率不同。
I says 1280 height, but in my OS I put 1690. Why is that? 我说1280高度,但是在我的操作系统中我输入了1690。为什么呢?
I have no browser zoom. 我没有浏览器缩放。
Is there a way to get the actual resolution? 有没有办法获得实际的分辨率?
I basically wrote my own thing to solve this (very handy for responsive sites). 我基本上写了我自己的东西来解决这个问题(对于响应式站点非常方便)。 I know there are plugs that exist but Safari is somewhat lacking. 我知道有一些插件,但缺少Safari。
So I only normally use the width to know when to add a media query but just add: 因此,我通常只使用宽度来知道何时添加媒体查询,而只需添加:
let viewportHeight = $(window).height();
to the following: 到以下内容:
$(window).resize(function(){
let viewportWidth = $(window).width();
let ems = viewportWidth / parseFloat($("body").css("font-size"));
$('#viewport').html(viewportWidth+" | "+ems);
$('#viewport-height').html(viewportHeight+" | "+ems); //add this for height
});
And then some simple CSS for viewing the size of your window: 然后是一些用于查看窗口大小的简单CSS:
#viewport {
background: #000;
color: #000;
top: 0;
right: 10px;
position: fixed;
z-index: 100;
}
This has never let me down yet, and you can see pixel by pixel when you reduce / increase browser size to help make the media queries. 这从来没有让我失望过,当您减小/增大浏览器大小以帮助进行媒体查询时,您可以逐像素查看。
Hope that helps... 希望有帮助...
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.