JavaScript処理Iframe適応高さの問題
4037 ワード
1.同ドメイン名でのIframe適応高さの処理
もちろんここではAspを使っています.Net MVCここでsrcはルーティング構造に設定
iframeネストされたページのロードが完了した場合、onloadイベントを使用してiframeにネストされたページの高さを取得し、Iframeの高さに値を付けるとよい.
2.ドメイン間でのIframe高さ適応
ホームフェースとネストされたiframeが異なるドメイン名の場合、JavaScriptのドメイン間制限を避ける必要があります.原理:既存iframeホームページmain.html、iframeにネストされたページiframe.html、iframe仲介ページagent.html 3つ、main.html(ドメイン名http://www.ccvita.com)ネストiframe.html(ドメイン名:http://www.phpq.net)は、ユーザが閲覧するとiframeを実行する.htmlのJavaScriptコードiframeCのscrアドレスにiframeページを入れる高さを設定します.agent.html(ドメイン名:http://www.ccvita.com)は伝達の高さを取得し、JavaScriptでmainを設定する.htmlのiframeの高さ.最終的に所期の目標を達成する.iframeホームページmain.html< !DOCTYPE html PUBLIC"-//W 3 C//TD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">iframeホームページ
末尾
iframeネストページiframe.html< !DOCTYPE html PUBLIC"-//W 3 C//TD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">iframeにネストされたページ
文字
文字
function sethash(){ hashH = document.documentElement.scrollHeight; urlC = "agent.html"; document.getElementByIdx("iframeC").src=urlC+"#"+hashH;}window.onload=sethash;
iframe仲介ページagent.html< !DOCTYPE html PUBLIC"-//W 3 C//TD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">iframe仲介ページ
function pseth() { var iObj = parent.parent.document.getElementByIdx('frame_content'); iObjH = parent.parent.frames["frame_content"].frames["iframeC"].location.hash; iObj.style.height = iObjH.split("#")[1]+"px";}pseth();
コードではkimiが不完全mainを経路で表す可能性がある.htmlとagent.htmlは同じドメインでなければなりませんiframe.htmlは別のドメインにあります
<iframe onload="Javascript:SetIFrameHeight(this)" src="../Home/b" id="win" name="win" width="100%" height="1"> </iframe>
もちろんここではAspを使っています.Net MVCここでsrcはルーティング構造に設定
<script type="text/javascript">
function SetIFrameHeight(obj) {
var win = obj;
if (document.getElementById) {
if (win && !window.opera) {
if (win.contentDocument && win.contentDocument.body.offsetHeight)
win.height = win.contentDocument.body.offsetHeight;
else if (win.Document && win.Document.body.scrollHeight)
win.height = win.Document.body.scrollHeight;
}
}
}
</script>
iframeネストされたページのロードが完了した場合、onloadイベントを使用してiframeにネストされたページの高さを取得し、Iframeの高さに値を付けるとよい.
2.ドメイン間でのIframe高さ適応
ホームフェースとネストされたiframeが異なるドメイン名の場合、JavaScriptのドメイン間制限を避ける必要があります.原理:既存iframeホームページmain.html、iframeにネストされたページiframe.html、iframe仲介ページagent.html 3つ、main.html(ドメイン名http://www.ccvita.com)ネストiframe.html(ドメイン名:http://www.phpq.net)は、ユーザが閲覧するとiframeを実行する.htmlのJavaScriptコードiframeCのscrアドレスにiframeページを入れる高さを設定します.agent.html(ドメイン名:http://www.ccvita.com)は伝達の高さを取得し、JavaScriptでmainを設定する.htmlのiframeの高さ.最終的に所期の目標を達成する.iframeホームページmain.html< !DOCTYPE html PUBLIC"-//W 3 C//TD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">
末尾
iframeネストページiframe.html< !DOCTYPE html PUBLIC"-//W 3 C//TD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">
文字
文字
iframe仲介ページagent.html< !DOCTYPE html PUBLIC"-//W 3 C//TD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">
コードではkimiが不完全mainを経路で表す可能性がある.htmlとagent.htmlは同じドメインでなければなりませんiframe.htmlは別のドメインにあります