的IFrame文檔的高度返回iframe的高度不是真實的高度

我有在Resizing an iframe based on content 的IFrame文檔的高度返回iframe的高度不是真實的高度

I幀體的高度發出的iframe體的高度，以使用三個幀技術父頁面的iframe中一些javascript似乎總是出現在900，iframe的視口高度。這在瀏覽器中是一致的。

iframe的：

<iframe id="printiq" src="http://myurl.com" height="900px" width="980px">Your browser does not support iframes.</iframe>

的IFRAME內的腳本：

$(window).load(function() { 
    var height = document.body.scrollHeight + 60; 
    alert('Height: ' + height); //Always returns 900, the height of the iframe 
    var whirlwind_url = 'http://whirlwind.ben.dev/iframe_helper'; 
    var iframe_html = '<iframe id="height_helper" src="'+whirlwind_url+'?height='+height+'"></iframe>'; 
    $('body').append(iframe_html);

}）;

奇怪的是，當我檢查與螢火蟲沒有高度變量（scrollHeight屬性，的offsetHeight等）設定爲900

來源

2010-07-06 Keyo

問題的DOM是在的iFrame網頁div被擴展到的高度視口。我通過更改CSS來修復它。

這是我結束的代碼。

父窗口。

function resizeIframe(height) { 
    height = parseInt(height) + 60; 
    $('iframe#printiq').attr('height', height); 
}

iframed外部網站的腳本。

$(window).load(function() { 
    var height = $('#container').height() + $('#header').height(); 
    var whirlwind_url = 'http://whirlwind.ben.dev/iframe_helper'; 
    var iframe_html = '<iframe id="height_helper" src="'+whirlwind_url+'?height='+height+'"></iframe>'; 
    $('body').append(iframe_html);

}）;

嵌入到iframe中的iframe助手。瀏覽器窗口的孫子，如果你喜歡。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <!-- 
    This page is on the same domain as the parent, so can 
    communicate with it to order the iframe window resizing 
    to fit the content 
    --> 
    <body onload="parentIframeResize()"> 
     <style type="text/css"> 
      body{ 
       border:none; 
       display:none; 
      } 
     </style> 
     <script> 
      // Tell the parent iframe what height the iframe needs to be 
      function parentIframeResize() 
      { 
       var height = getParam('height'); 
       // This works as our parent's parent is on our domain.. 
       parent.parent.resizeIframe(height); 
      } 

      function getUrlVars() 
      { 
       var vars = [], hash; 
       var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); 
       for(var i = 0; i < hashes.length; i++) 
       { 
        hash = hashes[i].split('='); 
        vars.push(hash[0]); 
        vars[hash[0]] = hash[1]; 
       } 
       return vars; 
      } 

      // Helper function, parse param from request string 
      function getParam(name) 
      { 

       var results = getUrlVars(); 
       if(results == null) 
        return ""; 
       else 
        return results['height']; 
      } 
     </script> 
    </body> 
</html>

來源

2010-07-07 01:35:46 Keyo

的IFrame文檔的高度返回iframe的高度不是真實的高度

回答

相關問題