如何通过JS控制父级别框架可是高度

发布时间:2020-06-24 18:16:14 作者:rmlifejun
来源:网络 阅读:731

JS 控制框架高度自适应浏览器:

框架主页面代码如下:

   <body>
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
            <td width="8" bgcolor="#353c44">
                &nbsp;
            </td>
            <td width="191" valign="top">
                <iframe height="100%" width="100%" border="0" frameborder="0" src="/Common/Left"
                    name="leftFrame" id="leftFrame" title="leftFrame"></iframe>
            </td>
            <td width="10" bgcolor="#fff">
                &nbsp;
            </td>
            <td valign="top">
                <iframe width="100%" border="0" frameborder="0" src="/Common/SuppotMain" name="rightFrame"
                    id="rightFrame" title="rightFrame" overflow-y="auto" overflow-x="none"></iframe>
            </td>
            <td width="8" bgcolor="#353c44">
                &nbsp;
            </td>
        </tr>
    </table>
</body>


内页改变 rightFrame 框架高度JS代码如下:

<script>
    function resize() {
        $("#rightFrame", window.parent.document).css("height", $(window.parent.window).height());
    }
    $(document).ready(resize);
    $(window.parent.window).resize(resize);

</script>


框架主页面改变 rightFrame 框架高度JS代码如下:

<script>
    function resize() {
        $("#rightFrame").css("height", $(window).height());
    }
    $(document).ready(resize);
    $(window).resize(resize);

</script>


注: 

    $(window).height() 获取浏览器可视高度

    $(document).height() 获取页面高度

    

推荐阅读:
  1. 如何通过js获取Html元素的实际宽度高度
  2. html如何撑起浮动父元素的高度

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

浏览器 height

上一篇:css3增加了哪些伪类

下一篇:wordpress数据库结构及表说明

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》