设置浏览器窗口最小化的最小大小限制

Setting minimum size limit for a window minimization of browser?

本文关键字：小大 浏览器 窗口 最小化 设置      更新时间：2023-09-26

是否有一种方法可以手动设置所有浏览器窗口的最小大小?

你可以试试

body {  min-width:600px; }

你将得到一个水平滚动条一旦视窗得到小于600px。这只能在支持min-width CSS属性的现代浏览器中工作。

我认为限制用户调整大小是不可能的，也不应该这样做!

大多数情况下，您必须使用Javascript并创建有问题的窗口，因为选项卡窗口不允许您重新定义包含其他选项卡的窗口的大小。即使这样，一些浏览器也不允许你这样做。

使用window.open，你可以指定一个640 * 480大小的窗口:

window.open('http://www.your.url/','yourWindowsName','width=640,height=480');

在窗口内，您可以尝试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)

你应该考虑到以上两种行为都是有争议的，你所描述的有效地限制了用户使用他们认为合适的浏览器的自由。因此，我不希望它在任何地方都能工作-但是在它可以工作的地方，这是允许您这样做的代码。

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)

这是我确保实际最小内容宽度和高度的解决方案，其中包括处理不同浏览器的"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);
相关文章：