如何動態調整 Iframe 的大小以適應其內容？
- Barbara Streisand原創
- 2024-10-26 19:44:02450瀏覽
根據內容動態調整iframe 高度
問題：
在網站中合併iframe，目標是動態確定iframe適當高度。理想情況下，iframe 應適應其顯示的內容，無需滾動條，類似於網站內的無縫整合。
答案：
最初嘗試 JavaScript 計算高度時，拒絕存取權限阻礙了進度。隨後，考慮使用 Ajax 或 PHP。
但是，解決方案在於利用 window.onload 中 iframe 頁面的觸發器將正文高度傳達給父親頁面。然後，父級會相應地調整 iframe 高度。
<code class="html"><body onload='parent.resizeIframe(document.body.scrollHeight)'></code>
<code class="javascript">function resizeIframe(newHeight)
{
document.getElementById('blogIframe').style.height = parseInt(newHeight,10) + 10 + 'px';
}</code>
雖然 iframe 最初可能以預設高度顯示，但可以透過最初顯示載入影像並隱藏 iframe 來緩解這種情況。一旦 resizeIframe 函數收到高度更新，它可以刪除載入圖像並顯示 iframe，模擬類似 Ajax 的體驗。
或者，如果出現跨域限制，代理 PHP 腳本可以促進嵌入。然而，為了最大限度地控制和易於實施，透過 PHP 直接嵌入部落格的 RSS feed 提供了一個可行的解決方案。
以上是如何動態調整 Iframe 的大小以適應其內容？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn