Html 为浏览器的窗口最小化设置最小尺寸限制？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16173965/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Setting minimum size limit for a window minimization of browser?
提问by Human Being
Is there a way to manually set the minimum size of a browser window across all browsers?
有没有办法在所有浏览器中手动设置浏览器窗口的最小大小？
回答by Barney
You'll have to use Javascript and create the window in question for this to work most of the time, since tabbed bowsers won't let you redefine the size of the window containing other tabs. Even then, some browsers won't let you do this.
您必须使用 Javascript 并创建有问题的窗口才能在大多数情况下工作，因为选项卡式浏览器不会让您重新定义包含其他选项卡的窗口的大小。即便如此，某些浏览器也不会让您这样做。
Using window.open, you can make a given window of size 640 * 480 by specifying:
使用window.open，您可以指定大小为 640 * 480 的给定窗口：
window.open('http://www.your.url/','yourWindowsName','width=640,height=480');
Within the window you can try and resizeToheight and width triggered by the resizeevent handler like the following:
在窗口中，您可以尝试resizeTo由resize事件处理程序触发的高度和宽度，如下所示：
function resizeToMinimum(){
var minimum = [640, 480];
var current = [window.outerWidth, window.outerHeight];
var restricted = [];
var i = 2;
while(i-- > 0){
restricted[i] = minimum[i] > current[i] ? minimum[i] : current[i];
}
window.resizeTo(current[0], current[1]);
}
window.addEventListener('resize', resizeToMinimum, false)
You should take into account that both behaviours above are contentious, and what you're describing effectively restricts the freedom of the user to use their browser as they see fit. As such, I wouldn't expect this to work everywhere — but in places where it does, this is the code that will allow you to do so.
您应该考虑到上述两种行为都是有争议的，并且您所描述的内容有效地限制了用户在他们认为合适的情况下使用浏览器的自由。因此，我不希望这在任何地方都有效——但在它可以做到的地方，这是允许您这样做的代码。
回答by Gurpreet Singh
You can try
你可以试试
body { min-width:600px; }
You will get a horizontal scrollbar once the viewport gets less than 600px. This will work in only modern browsers supporting min-width CSS property.
一旦视口小于 600 像素，您将获得一个水平滚动条。这仅适用于支持 min-width CSS 属性的现代浏览器。
I don't think it is possible to restrict user from resizing, and it shouldn't be!
我认为不可能限制用户调整大小，也不应该！
回答by Tito100
function resizeToMinimum(w,h){
w=w>window.outerWidth?w:window.outerWidth;
h=h>window.outerHeight?h:window.outerHeight;
window.resizeTo(w, h);
};
window.addEventListener('resize', function(){resizeToMinimum(100,100)}, false)
回答by Gabri?l Wolmarans
Here's my solution for ensuring actual minimum content width and height, which includes dealing with different browser's "chrome" dimensions. This doesn't work with Firefox, but I've tested it in Edge and Chrome.
这是我确保实际最小内容宽度和高度的解决方案，其中包括处理不同浏览器的“chrome”尺寸。这不适用于 Firefox，但我已经在 Edge 和 Chrome 中对其进行了测试。
function ensureMinimumWindowSize(width, height) {
var tooThin = (width > window.innerWidth);
var tooShort = (height > window.innerHeight);
if (tooThin || tooShort) {
var deltaWidth = window.outerWidth - window.innerWidth;
var deltaHeight = window.outerHeight - window.innerHeight;
width = tooThin ? width + deltaWidth : window.outerWidth;
height = tooShort ? height + deltaHeight : window.outerHeight;
// Edge not reporting window outer size correctly
if (/Edge/i.test(navigator.userAgent)) {
width -= 16;
height -= 8;
}
window.resizeTo(width, height);
}
}
var resizeTimer;
window.addEventListener('resize', function(event) {
clearTimeout(resizeTimer);
resizeTimer = setTimeout(function () {
ensureMinimumWindowSize(<width>,<height>);
}, 250);
}, false);
