iframe沒有調整內容高度

我一直試圖讓這個工作一段時間，但無濟於事。 ive嘗試過各種腳本，但我顯然做錯了什麼:(但是我很明顯做錯了:(iframe沒有調整內容高度

我有一個頁面左側的菜單，其中包含（相同的服務器）href鏈接，其目標是頁面右側的iframe

它會將頁面的iframe正常，但iframe的高度不會改變

是否有人可以幫助我:(

這裏是我的代碼：

HTML

<link rel="stylesheet" type="text/css" href="jquery.pageslide.css"> 
<script type="text/javascript" src="jquery/jquery-1.8.3.min.js"></script> 
<script type="text/javascript"> 

function sizeIframeToContent(id) { 
    // resize iframe to be the height of the content 
    try { 
     var frame = document.getElementById(viewcontent); 
     innerDoc = (frame.contentDocument) ? 
        frame.contentDocument : frame.contentWindow.document; 
     var objToResize = (frame.style) ? frame.style : frame; 
     objToResize.height = innerDoc.body.scrollHeight + 10 + 'px'; 
     //objToResize.width = innerDoc.body.scrollWidth + 10 + 'px'; 
    } 
    catch (err) { 
     console.log(err.message); 
    } 
}

....菜單鏈接

<div class="menuOut" onMouseOver="this.className='menuIn'" onMouseOut="this.className='menuOut'"> 
      <a href="forum_frame.php?forum=guest" target="viewcontent">- Forum Adverts </a></div>

.... iframe的HTML

<div id=maincontain> 
<iframe id="viewcontent" frameborder="0"> 
</iframe> 
</div>

CSS

#maincontain { 
    width: 85%; 
    float: none; 
    margin-left: 12%; 
} 
#viewcontent { 
    width: 100%; 
    padding-top: 15px; 
    float: none; 
}

iframe的只是停留大約300像素高度，除非我指定手動更大的高度。

正在加載的頁面，全部都有800px +高度。

謝謝。

來源

2013-02-09 user1953045

你可以請一個JSFiddle嗎？ – 2013-02-09 21:04:44

...爲什麼這個問題是在jQuery標籤？ – JFK 2013-02-09 21:10:20

iframes的高度不受內容的影響。這就是iframe的工作原理。如果您需要縮小或增大它們，則需要手動執行此操作。在這裏閱讀更多：

來源

2013-02-09 21:25:12

那麼實現我想要做什麼的最佳方式是什麼？我只有1頁，default.php，左側有一個菜單，右側有一個大的iframe。當我點擊菜單中的一個環節，將其發送到iframe中。我只是想讓iframe成爲我點擊頁面的大小。：\ 如果我去一下硬盤的方式，什麼是最好的使用方法？ – user1953045 2013-02-09 21:36:07

@ user1953045第二個鏈接中的文章完整地解釋了您需要執行的操作以及準備粘貼的代碼。這是一個10分鐘的閱讀。 – 2013-02-09 21:39:04

我完全閱讀了文章。它與今天許多其他閱讀器類似。我完全按照它，但它仍然不會工作。我顯然做錯了什麼。我可能會放棄說實話，看看另一種方法。令人沮喪的是，它沒有理由不工作。 – user1953045 2013-02-09 21:45:13

你試過JQuery的？

你可以使用：

$("#viewcontent").height($("#viewcontent").contents().find("html").height());

而只是調用你想要的iframe來調整對任何事件。我已經爲我自己的一個項目進行了關鍵的工作。這是jsFiddle。

來源

2013-02-14 15:41:45 Matt

請嘗試以下腳本：

<script language="JavaScript"> 
<!-- 
function autoResize(id){ 
    var newheight; 
    var newwidth; 

    if(document.getElementById){ 
     newheight=document.getElementById(id).contentWindow.document .body.scrollHeight; 
     newwidth=document.getElementById(id).contentWindow.document .body.scrollWidth; 
    } 

    document.getElementById(id).height= (newheight) + "px"; 
    document.getElementById(id).width= (newwidth) + "px"; 
} 
//--> 
</script> 

<iframe src="test.html" width="100%" height="200px" id="my_frame" marginheight="0" frameborder="0" onLoad="autoResize('my_frame');"></iframe>

你應該有源文件在你的domain.this已經討論點擊here

跨域的iframe調整大小，請點擊 here

來源

2013-04-24 11:39:58

iframe沒有調整內容高度

回答

相關問題