如何将全高 iframe 插入空白的 WordPress 仪表板？

Question

在尝试制作一个空白的 WordPress Dashboard 并将 iframe 插入空白空间时，我发现 iframe 只能有固定的高度。

但要很好地集成此自定义，需要 100% 的高度。

在WordPress StackExchange Q&A 中，我编写了制作完全空白仪表板的技术，隐藏图标和标题、屏幕选项和所有小部件（默认并由插件添加）。

---

如果我使用下面的 jQuery 注入 iframe，它不会占据 100% 的高度，无论我在管理样式表中添加什么 CSS...

$('#wpbody').html(
    '<iframe src="http://example.com" 
     frameborder="0" id="myframe"  
     style="height:100%;margin:0;padding:0;left:0;top:0" 
     scrolling="auto" width="100%" height="100%"></iframe>'
); 

问题是：如何让 iframe 填充所有 #wpbody 空间并保持这种状态？

Answer 1

在blog post 中找到了解决方案^{（非常感谢，Jim，漂亮的代码！）}。

再加上WordPress StackExchange Q&A，以下内容将在仪表板屏幕内显示一个全尺寸的 iframe。

add_action( 'admin_head-index.php', 'wpse_73561_dashboard_scripts' );

function wpse_73561_dashboard_scripts() 
{
    ?>
        <style>
            .wrap h2, .postbox .handlediv, #icon-index { display:none }
            #wpcontent { margin-left:0 !important }
        </style>
        <script language="javascript" type="text/javascript">   
            function sizeIFrame() 
            {
                var helpFrame = jQuery("#myframe");
                var innerDoc = (helpFrame.get(0).contentDocument) 
                ? helpFrame.get(0).contentDocument 
                : helpFrame.get(0).contentWindow.document;

                helpFrame.height(innerDoc.body.scrollHeight + 35);
            }

            jQuery(function() 
            {
                sizeIFrame();
                jQuery("#myframe").load(sizeIFrame);
            });

            jQuery(document).ready(function($) 
            {
                $('#wpbody').html(
                    '<iframe src="http://example.com" 
                     frameborder="0" id="myframe" 
                     style="margin:0;padding:0;left:0;top:0" 
                     scrolling="auto" 
                     width="100%" height="100%"></iframe>'
                );
            });
        </script>   
    <?php
}