javascript - js如何动态设置iframe高度宽度？

问题描述

问 题

iframe高度等于浏览器可视区域高度减去50px，宽度等于浏览器可视区域宽度减去180px，点击某个按钮iframe宽度等于浏览器可视区域宽度-50px。

像这种需求应该如何写？

解决方案

按钮在哪儿？
按钮在iframe里面就用下面这段函数做click的回调计算高度

    function clickHanlder() {
        var doc = document,
            p = window.parent,
            iframes = p.frames,
            iframe,
            i = 0;
        while (iframe = iframes[i++]) {
            if (iframe.document == doc) {
                var iheight = doc.documentElement.clientHeight - 50;
                iframe.frameElement.style.height = iheight - 50 + "px";
                break;
            }
        }
    }

按钮在iframe外面就用下面这段函数做click的回调计算高度

    function clickHanlder() {
        var doc = document,
            iframe = document.getElementById('your-iframe-id'),
            iheight = doc.documentElement.clientHeight - 50;
        iframe.style.height = iheight + "px";
    }

宽度用css控制最好，类似下面这样应该可以吧？
.you-iframe-class {

display: block;
margin: 0 90px;

}

这篇关于javascript - js如何动态设置iframe高度宽度？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！