javascript - 为浏览器的窗口最小化设置最小大小限制？

Question

有没有办法在所有浏览器中手动设置浏览器窗口的最小尺寸？

Answer 1

你可以试试

body {  min-width:600px; }

一旦视口小于 600 像素，您将获得一个水平滚动条。这仅适用于支持 min-width CSS 属性的现代浏览器。

我认为不可能限制用户调整大小，也不应该！

Answer 2

您必须使用 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)

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

Answer 3

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)

Answer 4

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