iframeに垂直方向のスペースを取る

Question

iframeには、コンテンツを表示し、スクロールバーを表示するのに必要なだけの垂直方向のスペースが必要です。それはすべて可能ですか？

回避策はありますか？それが必要として、それは同じくらい垂直方向のスペースを取ることについてはまだ

body { 
    overflow-x: hidden; 
    overflow-y: hidden; 
} 

私はわからないんだけど、私は理解できない場合、私はわかります

Answer 1

これは、その内容の高さにIFRAME高さを設定する必要があります。

編集：おっと、忘れてthe_heightを宣言してください。

Answer 2

このCSSスニペットは、垂直スクロールバーを削除する必要がありますそれを出す。

<script type="text/javascript"> 
the_height = document.getElementById('the_iframe').contentWindow.document.body.scrollHeight; 
document.getElementById('the_iframe').height = the_height; 
</script> 

あなたはスクロールバーをオフにするには、あなたのIFRAMEにscrolling="no"を追加することもできます。

Answer 3

は

document.getElementById('the_iframe').contentWindow.document.body.scrollHeight 

私はIEとFFの両方に問題を抱えていたW3C DOCTYPE for examples

参照ラインから正しい値を計算するのに役立ちますIFRAMEソース文書にDOCTYPE宣言を追加することは、レンダリングされたようDOCTYPEを追加するまで、 'quirks'モードのドキュメントをiframeに追加してください。

FF/IE/Chromeのサポート：.scrollHeightはChromeで動作しないので、jQueryを使用してiframeコンテンツに基づいてすべてのIFRAMEの高さを設定するjavascriptの例を考え出しました。注：これは現在のドメイン内の参照ページ用です。

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('iframe').each(function(){ 
      var context = $(this); 
      context.load(function(event){ // attach the onload event to the iframe 
       var body = $(this.contentWindow.document).find('body'); 
       if (body.length > 0 && $(body).find('*').length > 0) { // check if iframe has contents 
        context.height($(body.get(0)).height() + 20); 
       } else { 
        context.hide(); // hide iframes with no contents 
       } 
      }); 
     }); 
    }); 
</script> 

Answer 4

回避策は、サーバ側でとプリプロセスコードを使用しないことです。

Answer 5

このスレッドもチェックしてください：How does the DiggBar dynamically resize its iframe's height based on content not on their domain?

これは同じ質問に対処しています。