JavaScript 窗口按比例调整大小

Question

我用w=window.open('','', 'width=1000,height=700'); 打开一个窗口，而不是我希望这个窗口以 10/7 的比例调整大小。 例如：500/350； 100/70 ...

我已经有了最大和最小尺寸：

    var w;
function openwindow()
{
    w=window.open('','', 'width=1000,height=700');
    w.focus();

    resize(w);
}

function resize(w_obj) {


        w_obj.onresize = function(event) {
            width = w_obj.innerWidth;
            height = w_obj.innerHeight;

            // if popup width is greather then 1000px
            if (width > 1000) {
                w_obj.resizeTo(1000,700);
            }

            // if popup height is greather then 700px
            if(height >700) {
                w_obj.resizeTo(1000,700);
            }


            if (width < 500) {
                w_obj.resizeTo(500,350);
            }


            if(height < 350) {
                w_obj.resizeTo(500,350);
            }

        }


}

Answer 1

您应该使用outerHeight，因为这就是resizeTo 的参数的含义。然而，一个问题是您无法知道用户是否调整了窗口的宽度或高度。因此，您不知道使用哪个维度作为参考以及计算哪个维度。

无论如何，你想要的是以下内容：

• 将width 和height 夹在其最小和最大尺寸之间。您可以为此使用Math.min/Math.max。
• 将高度设置为 width 乘以 7 / 10 比率。

见http://jsfiddle.net/bSE9C/1/。

var width = w_obj.outerWidth;
var height = w_obj.outerHeight;

width = Math.min(width, 1000);  // may not exceed 1000 maximum
height = Math.min(height, 700);

width = Math.max(width, 500);   // may not exceed 500 minimum
height = Math.max(height, 350);

height = width * 7 / 10;

w_obj.resizeTo(width, height);