根据contentDocument内容的高度调整iframe的高度

版本一

<script>
        $(function () {

            //根据contentDocument的高度调整menuFrame的高度
            var menuFrame = document.getElementById('menuFrame');
            menuFrame.addEventListener('load', function () {
                menuFrame.height = 0;
            });
            setInterval(function () {
                menuFrame.height = getHeight(menuFrame.contentDocument);
            }, 200);
            window.addEventListener('resize', function () {
                menuFrame.height = 0;
                menuFrame.height = getHeight(menuFrame.contentDocument);
            });


        });

        function getHeight(doc) {
            if (doc == null) {
                //menuFrame.height = 1000;
                return 2000;
            }

            var body = doc.body,
                html = doc.documentElement;

            var height = parseInt($('#contentWrapper').css('min-height')) - 15;
            if (body.scrollHeight && body.offsetHeight && html.clientHeight && html.offsetHeight) {
                height = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight);
            }
            return height;
        }
    </script>

版本二

<iframe id="menuFrame" name="menuFrame" frameborder="0" style="width: 100%; height: 100%; position: absolute;"></iframe>
posted @ 2021-05-14 14:34  vvull  阅读(81)  评论(0编辑  收藏  举报