滾動一個大小適合瀏覽器窗口的div

Question

所以首先，我知道有很多可滾動的div問題，但是我沒有看到一個似乎可以解決我的問題的問題，所以請耐心等待！

這是我正在嘗試做的事情：

• 我需要在iFrame中顯示一些內容（這是我需要嵌入到應用程序中的報告輸出）。
• 我在div中托管iFrame。
• 我希望div和iFrame的大小取決於用戶瀏覽器窗口的大小。
• 如果iFrame中的內容大於div，則我希望div滾動
• 我無法使iFrame滾動，因為它確實托管在較大的UI構造中-如果iFrame具有滾動條，則我的“真實”應用程序中可能會有2套滾動（在“真實生活”中，我不會可以控制Div）。

問題是：我有滾動條，但大型報表仍被垂直剪切-好像滾動沒有真正考慮div的整個大小。

這是我的HTML：

<div style="width:100%; height:100%; overflow: auto">
  <iFrame src="a url" style="width:100%; height:100%" scrolling="no"></iFrame>
</div>

如果我從div中刪除了溢出樣式並使iFrame可滾動，則它可以工作，但是我不能在生產中這樣做，因為該iFrame的主機確實需要擁有滾動條。

Answer 1

不幸的是，您擁有的代碼無法正常工作。 當您將DIV設置為100％高度時，它會根據相對於瀏覽器窗口的高度進行查看，因此它會在那里停止。 它無法知道iframe內部需要多少高度。

可能有一種方法可以使用JavaScript進行所需的操作。 檢查此SO問題，它可能正在尋找您想要的解決方案： 調整iframe的寬度高度以適合其中的內容