使用iFrame调整器时，填充到调整大小的iFrame的顶部

Padding to top of resized iFrame when using iframe-resizer

本文关键字：iFrame 顶部 调整 填充 调整器 使用      更新时间：2023-09-26

所以我使用了很棒的iframe resizer库来调整iframe的大小并使其保持焦点。

问题是（就我的一生而言）我不知道如何制作iFrame，当调整大小时，在顶部添加一些额外的填充。

发生的情况是，iFrame在某个点上调整大小，窗口向上滚动，但iFrame被放置在固定菜单下（请参见下文）。我认为这是因为iFrameResize使用的是完整的窗口大小，而不考虑固定菜单。我不知道该怎么修？

这是html基本

<div style="position:fixed;z-index:99; width:100%">
 <nav class="top-bar"><section>
  <ul><li><a href="http://somelink">top link></li><li><a href="http://somelink">top link></li></ul>
 </section></nav>
</div>
<div style="float:left;width:50%;">left panel with text</div>
<div style="float:right;width:50%;">
  <div>
   <iframe style="border:none;overflow:hidden;" src="http://someurl" width="80%" height="100%" scrolling="no" id="iFrameResizer0"></iframe>
   <script>iFrameResize({log: true, 
        checkOrigin: false,
        enablePublicMethods: true,
    })
   </script>
  </div>
</div>

如果有人能指导我更改和/或添加额外的参数，那将是非常棒的。

为了记录在案，我试图添加一个额外的页边空白和填充顶部，但这并没有解决问题。此外，第一次加载页面时，这两列的高度应该相同，所以这不是一个理想的解决方案。

看看在需要时使用resizeCallback来添加填充。

相关文章：