1

過去2日間、私を悩ませてきた問題があります:(

フレームセット ドキュメントをロードするiFrameを含む HTML Web ページをセットアップしました。はい、フレームは古い技術であり、使用すべきではありませんが、これは Adob​​e の RoboHelp ツールから生成された出力であるため、対処する必要があります。

iFrame の高さをブラウザー ウィンドウの残りの高さに合わせてサイズ変更する JavaScript コードのバリエーションを追加しようとしました。Chrome、Safari、Firefox などでは正常に動作しますが、ほとんどの組織と同様に、クライアントは古い IE (Internet Explorer 8) に標準化されており、すぐに前進するようには見えません。

現在の問題のイメージをここに示します。

iframe は IE 8 の残りのスペースを占有しません

簡単に言えば、Internet Explorer (8) のバナーとフッターの間に残っているスペースを iFrame で占有することができません。サイズ変更のために内部フレームに高さを渡すために、CSS スタイルと JavaScript コードのバリエーションの両方を使用して、「フレームセット(?)」ドキュメントの高さを「読み取り」(推測) しました。私が見たスクリプトのほとんどは、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" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style>
body {
width:100%;
height:100%
}
</style>
<script language="javascript" type="text/javascript">
function autoHeight(e)
{
    alert(e);
    if ( e.contentDocument ) {

        e.height = e.contentDocument.body.offsetHeight + 35;
    }
    else {
        e.height = e.contentWindow.document.body.scrollHeight + 35;
        alert("e.contentWindow = "+ e.contentWindow);
    }
}



this.onload = function(e) {
// or add it to the onload attribute of the body tag...
var ifr = document.getElementById('helpFrame');
    autoHeight(ifr);
}

</script>
</head>
<body>
<!--banner code here, not too important -->
<iframe frameborder="0" id="helpFrame" align="bottom" src="/RCMP/prod/index.htm" width="100%" height="100%" scrolling="no" style="height:100%;">
    Your browser does not support iframes.
</iframe>
<!-- added some paragraphs to actually "push" the footer down for now. -->
<p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p>
<!--footer code here-->
</body>
</html>

そして、これはフレームセットのコードです (Adobe の RoboHelp 公開出力からの iFrame に含まれています)。多くの JavaScript は無視できますが、フレームセットに焦点が当てられていると思います)

<html>
<head>
 <link rel="shortcut icon" href="favicon.ico">
 <title>Orientation Guide To E-Division Headquarters</title>

 <meta name="generator" content="Adobe RoboHelp 9" />
 <meta name="description" content="WebHelp 5.50" />

</head>


<frameset cols="100%,*" frameborder=no border=0>
  <frame src="whnjs.htm">
  <frame src="whskin_blank.htm" noresize>
</frameset><noframes></noframes>

</html>

課題は、その iFrame を IE でフルハイト (フッターまで) にすることです! 任意の提案/解決策をいただければ幸いです。必要がなければ、jQuery を使用したくありません。JavaScript と CSS があれば便利です。

ありがとう！

4

0 に答える 0