js自适应

最新推荐文章于 2024-11-18 22:18:13 发布

原创最新推荐文章于 2024-11-18 22:18:13 发布 · 542 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#自适应

Js模块化开发案例分析专栏收录该内容

34 篇文章

订阅专栏

本文介绍了一种通过JavaScript实现IFrame自适应高度的方法。利用$(window).resize()监听窗口大小变化并调整IFrame的高度，确保IFrame内容能完全显示且不出现滚动条。适用于网页布局需要IFrame元素随着浏览器窗口大小变化而自动调整的情况。

    function fixHeight() {
        var headerHeight = $("#switcher").height();
        $("#iframe").attr("height", $(window).height() + "px");
    }
    $(window).resize(function() {
        fixHeight();
    }).resize();

//iframe页面自适应
function setIframeHeight(iframe) {
    if (iframe) {
        var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow;
        if (iframeWin.document.body) {
            iframe.height = iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight - 20;
        }
    }
}