使用jQuery获取视区大小
如何使用jQuery确定浏览器视区的大小，并在调整页面大小时重新检测该大小？我需要使IFRAME大小到这个空间(在每个页边距进来一点)。
对于那些不知道的人来说，浏览器视区并不是文档/页面的大小。它是滚动前窗口的可见大小。
回答 5
Stack Overflow用户
发布于 2010-06-15 19:17:35
要获取视口的宽度和高度，请执行以下操作：
var viewportWidth = $(window).width();
var viewportHeight = $(window).height();页面的调整大小事件：
$(window).resize(function() {
});Stack Overflow用户
发布于 2013-05-27 08:26:41
Stack Overflow用户
发布于 2013-08-26 15:02:46
可以使用$(window).resize()来检测视口是否调整了大小。
当存在滚动条时，jQuery没有任何功能来持续检测viewport1的正确宽度和高度。
我找到了一个解决方案，它使用了现代化库，特别是mq函数，它可以打开对javascript的媒体查询。
以下是我的解决方案：
// A function for detecting the viewport minimum width.
// You could use a similar function for minimum height if you wish.
var min_width;
if (Modernizr.mq('(min-width: 0px)')) {
// Browsers that support media queries
min_width = function (width) {
return Modernizr.mq('(min-width: ' + width + ')');
};
}
else {
// Fallback for browsers that does not support media queries
min_width = function (width) {
return $(window).width() >= width;
};
}
var resize = function() {
if (min_width('768px')) {
// Do some magic
}
};
$(window).resize(resize);
resize();我的回答可能无助于将iframe的大小调整为100%的视口宽度，两边都有边距，但我希望它能为for开发人员提供安慰，让他们对javascript视口宽度和高度计算的浏览器不连贯感到沮丧。
也许这可以对iframe有所帮助：
$('iframe').css('width', '100%').wrap('<div style="margin:2em"></div>');1您可以使用$(window).width()和$(window).height()来获取一个数字，该数字在某些浏览器中是正确的，但在其他浏览器中是不正确的。在这些浏览器中，您可以尝试使用window.innerWidth和window.innerHeight来获得正确的宽度和高度，但我建议不要使用这种方法，因为它将依赖于用户代理嗅探。
通常，不同的浏览器对于是否包含滚动条作为窗口宽度和高度的一部分是不一致的。
注意：$(window).width()和window.innerWidth在使用相同浏览器的不同操作系统中都有所不同。请参阅：https://github.com/eddiemachado/bones/issues/468#issuecomment-23626238
https://stackoverflow.com/questions/3044573
复制相似问题
腾讯云开发者
