javascript - 改变网页的尺寸

Question

我有一个看起来像这样的网页:

http://yoursdproperty.com/index2.php?option=com_jumi&fileid=3&Itemid=11

我希望页面的大小与页面上小表单的尺寸相同。

我可以在页面的这段代码中修改什么吗？

<div id="mlcalc-w1">
<div id="mlcalc-w2">
<div id="mlcalc-w3">
<div id="mlcalc-w4">
<div id="mlcalc-w5">
<link rel="stylesheet" type="text/css" media="screen,projection" href="http://www.mortgageloan.com/sites/all/themes/mortgageloan/css/tool/mlcalc-inline.css">
<div id="mlcalc-pres">
<h2 id="mlcalc-head">
<em>19 Mortgage Calculators</em> <em><a href="http://www.mortgageloan.com/widgets/#tool-num-4" rel="nofollow" target="_blank">Get this Widget</a><span></span></em>
</h2><iframe id="mlcalc-calc" src="http://www.mortgageloan.com/tool/mortgage/mortgage-calculator-package-content" scrolling="no" border="0" frameborder="0"></iframe>
<p id="mlcalc-footer">
Related Resource: <a href="http://www.mortgageloan.com/">Refinance &amp; Mortgage Rates</a>. Calculator © MortgageLoan.com.
</p>
</div>
</div>
</div>
</div>
</div>
</div>

Answer 1

您可以使用 JavaScript 获取要调整大小的元素的计算高度和宽度，并将它们传递给 window.resizeTo 方法。

一个简单的例子:

此代码由 Robert Nyman 提供:

function getStyle(oElm, strCssRule){
    var strValue = "";
    if(document.defaultView && document.defaultView.getComputedStyle){
        strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
    }
    else if(oElm.currentStyle){
        strCssRule = strCssRule.replace(/\-(\w)/g, function (strMatch, p1){
            return p1.toUpperCase();
        });
        strValue = oElm.currentStyle[strCssRule];
    }
    return strValue;
}

现在我的代码:

window.onload = function() {
    var element = document.getElementById( 'micalc-calc' );
    var width = getStyle( element, 'width' );
    var height = getStyle( element, 'height' );
    window.resizeTo( parseInt( height ), parseInt( width ) );
};