iFrame動態調整大小

我有這段代碼，但不工作... iFrame不根據其內容調整大小...iFrame動態調整大小

我在做什麼錯？我試了很多代碼，任何人都在爲我工作...

有什麼建議嗎？

page.html中

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>TEST</title> 
</head> 
<body> 
    <iframe id="klaus" src="iframe.html" width="960" height="100%"></iframe> 
</body> 
</html>

Iframe.html的

<!DOCTYPE html> 
<html> 
<head> 
<title>pagina</title> 
<script language="Javascript" type="text/javascript"> 
    parent.document.getElementById("klaus").height = document.getElementById("size").scrollHeight + 40; 
</script> 
</head> 
<body> 
<div id="size"> 
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> 
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> 
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> 
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> 
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> 
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> 
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> 
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> 
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> 
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> 
</div> 
</body> 

</html>

來源

2013-04-09 Preston

嘗試刪除這樣的：'WIDTH = 「960」 HEIGHT = 「100％」' – 2013-04-09 12:45:35

沒有動靜 – Preston 2013-04-09 13:06:40

確定..我使用的JavaScript ..但沒有工作... – Preston 2013-04-09 13:10:18

我認爲這會幫助你，把這個塊在Iframe.html的頁面的結束和刪除塊。

<script language="Javascript" type="text/javascript"> 

    var _iframe = parent.document.getElementById("klaus"), 
     _height = _iframe.contentDocument.getElementById("size").scrollHeight || _iframe.contentWindow.document.getElementById("size").scrollHeight; 
     _iframe.height = _height + 40; 
</script>

來源

2013-04-09 13:18:32 Max

與詹姆斯的建議相同的問題...滾動條不更新，如果我打開更少（低）內容的另一頁... – Preston 2013-04-09 13:38:18

哇...這個作品！我鏈接到了錯誤的頁面 – Preston 2013-04-09 13:59:29

Hey max，看看這裏：http：//luilui.com.br/inverno2013/，我需要點擊菜單上的兩次以顯示整個頁面與您的代碼...那該怎麼樣?? – Preston 2013-04-10 01:52:41

你設置錯了height屬性。它缺少風格之前的高度。此外，該JavaScript代碼沒有被調用，我將它添加到在頁面的onload調用的函數。檢查代碼：

<title>pagina</title> 
<script language="Javascript" type="text/javascript"> 
function resizeIframe(){ 
parent.document.getElementById("klaus").style.height = document.getElementById("size").scrollHeight + 40; 
} 
</script> 
</head> 
<body onload="resizeIframe()">

來源

2013-04-09 13:01:57 fmodos

什麼都沒有發生...... – Preston 2013-04-09 13:07:22

我編輯我的帖子，JavaScript沒有被調用...請檢查它 – fmodos 2013-04-09 13:17:45

相同..你可以看看這裏：http://d-3.me/pagina.html – Preston 2013-04-09 13:23:08

I幀從未調整圖的基礎上的內容。你需要使用JavaScript來實現這一點。您的百分比樣式值始終會引用最接近的iframe內定位父項，就像大多數其他元素一樣。

這個問題說明了如何使用腳本這樣的：

Adjust width height of iframe to fit with content in it

來源

2013-04-09 13:10:08

詹姆斯這個..分段工作，如果你打開一個長滾動條的頁面，然後是另一個帶小滾動條的頁面，那個滾動條不適合新的尺寸，前一頁剩餘的尺寸......你能看看在這裏：http://d-3.me/pagina2.html - 點擊第一個鏈接 – Preston 2013-04-09 13:31:01

iFrame動態調整大小

回答

相關問題