Iframeをページの一番下まで埋めるようにしてください

Question

これは簡単な質問であるようですが、どこでも解決策を見つけることができないようです。

ウェブサイトでは、高さ43pxのページの上部にナビゲーションバーがあり、個々のページごとに編集する必要はありません。これは、iframeを置くことですその下に100％幅で、iframeのソースをターゲットとするナビゲーションボタンがあります。

ここで私が問題に遭遇するのは、iframeをiframeにすることができないように、ナビゲーションバーの一番下からページの最下部までiframeを拡張したいのですが、高さを100に設定するとそれはページ全体の高さに設定され、下部の余分な43pxを補うために2番目のスクロールバーを追加するので、どのようにiframeをnav barの下の残りのスペースに合わせることができますか？

私は異なる％を設定しようとしましたが、それは異なる解像度のモニタでは機能しません。そして、私はこれをクロスブラウザー（IE、Chrome、Safari、Mozilla、好ましくはOperaでも動作させる必要がありますが、これは必須ではありません）が必要です。

ごめんなさい。

Answer 1

かなり簡単です。現在のビューポートの高さからナビゲーションの高さを引いてiframeの高さに設定するだけです。

function ResizeIFrame() { 
    var nNavigationHeight = 43; // Assuming the 43px you stated above 
    var nViewHeight = document.body.clientHeight; 
    var nIframeHeight = nViewHeight - nNavigationHeight; 
    document.getElementById("YourIFrameID").style.height = nIframeHeight + "px"; 
} 

身体とhtmlを100％の高さに設定する必要があります。

body, html { 
    height: 100%; 
} 

私は、これはあなたが何をしたい達成するためのやや怪しげな方法であることを言及する必要がありますが、それはあなたの質問の手紙に真のソリューションです。クロスブラウザの頭痛が最小限に抑えられるように、バニラのJavascriptではなくJqueryを使用することをお勧めします（IE 7の現在のインストールでこのコードをテストしました。& 8、FF、Chrome、Safariは問題なしですが、異なる場合があります）。あなたがそのルートに行くことを決めるなら、divを使って優れたシンプルなAJAX機能を利用し、iframe全体を使用しない方がよいでしょう。